大家都该休息了！
休息休息，大家都休息了！{:5_110:}队长那么晚才休息啊。辛苦{:4_204:} 红影 发表于 2022-3-18 11:08
队长那么晚才休息啊。辛苦
这是什么精神？这是为了花潮夜以继日，通宵达旦的精神。这是脱离了低级趣味的精神，这是爱谁谁，能咋地的不要老命的精神！{:5_116:} 本帖最后由 加林森 于 2022-5-29 17:20 编辑 <br /><br />红影 发表于 2022-3-18 11:08
队长那么晚才休息啊。辛苦
不辛苦啊，守坛就是这样的。{:4_189:}
<style>
.mama { left: 20px; width: fit-content; height: fit-content; position: absolute; cursor: pointer; }
.wrap { width: 60px; height: 60px;box-reflect: right; -webkit-box-reflect: right; position: relative; }
.mama meter { width: 120px; height: 20px; position: relative; }
.wrap span { --ww: 6px; width: var(--ww); height: 60px; bottom: -6px; background-color: rgba(255,0,0,.6); display: inline-block; position: absolute; }
.wrap span:nth-child(2) { left: var(--ww); }
.wrap span:nth-child(3) { left: calc(var(--ww) * 2); }
.wrap span:nth-child(4) { left: calc(var(--ww) * 3); }
.wrap span:nth-child(5) { left: calc(var(--ww) * 4); }
.wrap span:nth-child(6) { left: calc(var(--ww) * 5); }
.wrap span:nth-child(7) { left: calc(var(--ww) * 6); }
.wrap span:nth-child(8) { left: calc(var(--ww) * 7); }
.wrap span:nth-child(9) { left: calc(var(--ww) * 8); }
.wrap span:nth-child(10) { left: calc(var(--ww) * 9); }
</style>
<div class="mama">
<div class="wrap"></div>
<meter id="meter" value="0" min="0" max="100" low="33" high="66" optimum="70"></meter>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=33933040.mp3" autoplay="autoplay" loop="loop"></audio>
</div>
<style>
.stage{
margin: auto;
position: relative;
left: -214px;
width: 1024px;
height: 610px;
background:#666 url('https://pic.imgdb.cn/item/629328e809475431292ced67.jpg');
perspective: 3000px;
perspective-origin: 50% 50%;
cursor: pointer;
}
<script>
let mama = document.querySelector('.mama'), wrap = document.querySelector('.wrap'), aud = document.querySelector('#aud'), meter = document.querySelector('#meter');
let num = (min, max) => Math.floor(Math.random() * (max-min+1)) + min, prog = (tt, cc) => 100 * cc / tt;
Array.from({length: 10}).forEach((ele) => {
ele = document.createElement('span');
ele.className = 'sskey';
ele.style.backgroundColor = `rgba(${num(0,255)},${num(0,255)},${num(0,255)},.95)`;
wrap.appendChild(ele);
})
let sskey = document.querySelectorAll('.sskey');
mama.onclick = () => aud.paused ? aud.play() : aud.pause();
aud.addEventListener('timeupdate', () => {
Array.from(sskey).forEach((ele) => {
ele.style.height = num(20, 60) + 'px';
})
meter.value = prog(aud.duration, aud.currentTime);
})
</script>
东篱闲人 发表于 2022-3-18 11:17
这是什么精神？这是为了花潮夜以继日，通宵达旦的精神。这是脱离了低级趣味的精神，这是爱谁谁，能咋地的 ...
哈哈哈哈，老兄说得真好听。来，喝水{:4_176:} 隊長 午安~{:5_106:}
朵嫣 发表于 2022-3-18 12:41
隊長 午安~
小朵嫣中午好！{:4_187:}你终于来了，大家都在想你哦。你还好吧！{:4_204:}{:4_190:} 謝謝隊長
我沒事啦~
事情都處理完了
可以上來玩了{:5_106:} 朵嫣 发表于 2022-3-18 12:46
謝謝隊長
我沒事啦~
事情都處理完了
好的好的，你安全了我就放心啦。{:4_171:}{:4_190:} 加林森 发表于 2022-3-18 12:51
好的好的，你安全了我就放心啦。
隊長不會以為我被宰了吧?{:5_106:} 朵嫣 发表于 2022-3-18 12:55
隊長不會以為我被宰了吧?
我怕你跑回去，菜菜不放你回来呢。 加林森 发表于 2022-3-18 12:57
我怕你跑回去，菜菜不放你回来呢。
不會啦
再怎麼忙
也要上來看看大家嘛~{:5_106:}
加林森 发表于 2022-3-18 12:27
哈哈哈哈，老兄说得真好听。来，喝水
实事求是。{:4_190:} 东篱闲人 发表于 2022-3-18 11:17
这是什么精神？这是为了花潮夜以继日，通宵达旦的精神。这是脱离了低级趣味的精神，这是爱谁谁，能咋地的 ...
看到爱谁谁，忽然想起有首这个名字的歌曲{:4_173:} 东篱闲人 发表于 2022-3-18 11:17
这是什么精神？这是为了花潮夜以继日，通宵达旦的精神。这是脱离了低级趣味的精神，这是爱谁谁，能咋地的 ...
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=2&id=1836118632&auto=1&height=66"></iframe> 加林森 发表于 2022-3-18 12:26
不辛苦啊，守坛就是这样的。
这样论坛早晚都有人了{:4_173:} 红影 发表于 2022-3-18 14:40
这样论坛早晚都有人了
嗯嗯。 朵嫣 发表于 2022-3-18 13:06
不會啦
再怎麼忙
也要上來看看大家嘛~
好的好的。
页:
[1]