加林森 发表于 2022-7-12 14:39

《小步舞曲》- 巴赫 大家来跳舞!

本帖最后由 加林森 于 2022-7-12 14:44 编辑 <br /><br /><style>
#papa { left: -352px; width: 1300px; height: 758px; background: blue url('https://pic.imgdb.cn/item/62cd0d43f54cd3f937126731.gif') no-repeat center/cover; box-shadow: 4px 4px 24px #000; position: relative; }
#hunter { position: absolute; width: 135px; height: 80px; transition: all 3s; z-index: 99; }
#prey { position: absolute; width: 240px; height: 240px; border-radius: 50%; }
#btnplay { position: absolute;left: 20px; top: 20px; width: 30px; height: 30px; cursor: pointer; border: none; outline: none; border-radius: 50%; }
#btnplay:hover { color: red; box-shadow: 1px 1px 1px #000; }
#lrcbox { position: absolute;left: 60px;top: 20px;font: normal 1.2em / 1.6em '宋体', sans-serif;color: snow;text-shadow: 1px 1px 2px #000; }
</style>

<div id="papa">
        <input id="btnplay" type="button" value=">" />
        <div id="lrcbox">LRC LOADING ...</div>
        <img id="hunter" alt="" src="https://www.huachaowang.com/static/image/smiley/hcbiaoqing2/114.gif" />
        <img id="prey" src="https://pic.imgdb.cn/item/62caa1c8f54cd3f93741ed9b.gif" alt="" />
</div>
<audio id="aud" src="https://www.joy127.com/url/3092.mp3" autoplay="autoplay" loop="loop"></audio>

<script>
let lrcAr = [
        ['0.00','曲名 : 小步舞曲(巴赫)'],
        ['5.00','歌手 : 巴赫'],
        ['10.00','帖名 : 小步舞曲(巴赫) '],
        ['160.00','谢谢欣赏 ']
];

let num = (min, max) => Math.floor(Math.random() * (max-min+1)) + min;
setTimeout(gogo,100);
btnplay.onclick = () => aud.paused ? aud.play() : aud.pause();
aud.addEventListener('playing', () => btnplay.value = '||');
aud.addEventListener('pause', () => btnplay.value = '>');

aud.addEventListener('timeupdate',function(){
        let tt = aud.currentTime;
        for(j=0; j<lrcAr.length; j++){
                if(tt >= lrcAr) lrcbox.innerHTML = lrcAr;
        }
});

function gogo() {
        let left = num(50,1050), top = num(420,518);
        prey.style.left = left + 'px';
        prey.style.top = top + 'px';
        hunter.style.left = left + 45 + 'px';
        hunter.style.top = top - 100 + 'px';
        setTimeout(gogo,6000);
}
</script>

梦油 发表于 2022-7-12 16:38

欣赏佳作,问候队长。

加林森 发表于 2022-7-12 16:42

梦油 发表于 2022-7-12 16:38
欣赏佳作,问候队长。

谢谢啦!

绿叶清舟 发表于 2022-7-12 16:44

队长这是想跳醉舞啊{:4_189:}

加林森 发表于 2022-7-12 16:46

绿叶清舟 发表于 2022-7-12 16:44
队长这是想跳醉舞啊

多浪漫哦,边挑边喝。

绿叶清舟 发表于 2022-7-12 16:48

加林森 发表于 2022-7-12 16:46
多浪漫哦,边挑边喝。

是啊,跳醉舞更爽了

加林森 发表于 2022-7-12 16:50

绿叶清舟 发表于 2022-7-12 16:48
是啊,跳醉舞更爽了

就是,酒醉的那啥。。。。。{:4_189:}

红影 发表于 2022-7-12 16:51

有美酒有舞蹈,队长的帖子真欢乐{:4_187:}

加林森 发表于 2022-7-12 17:43

红影 发表于 2022-7-12 16:51
有美酒有舞蹈,队长的帖子真欢乐

玩玩的。{:4_189:}

梦油 发表于 2022-7-12 18:17

加林森 发表于 2022-7-12 16:42
谢谢啦!

什么时候我们花潮论坛办个舞会啊。

加林森 发表于 2022-7-12 18:19

梦油 发表于 2022-7-12 18:17
什么时候我们花潮论坛办个舞会啊。

这个我不知道了。

马黑黑 发表于 2022-7-12 18:54

杯子也跳起来了,厉害

小辣椒 发表于 2022-7-12 19:34

队长 这个背景图图你放大了,感觉像素低了

加林森 发表于 2022-7-12 20:14

马黑黑 发表于 2022-7-12 18:54
杯子也跳起来了,厉害

师傅教得好!

马黑黑 发表于 2022-7-12 20:14

加林森 发表于 2022-7-12 20:14
师傅教得好!

小辣椒小师傅确实厉害

红影 发表于 2022-7-12 20:15

加林森 发表于 2022-7-12 17:43
玩玩的。

很有趣{:4_173:}

加林森 发表于 2022-7-12 20:15

小辣椒 发表于 2022-7-12 19:34
队长 这个背景图图你放大了,感觉像素低了

我还用不来PS的。

加林森 发表于 2022-7-12 20:19

红影 发表于 2022-7-12 20:15
很有趣

我直接切换过来的。{:4_189:}

加林森 发表于 2022-7-12 20:20

马黑黑 发表于 2022-7-12 20:14
小辣椒小师傅确实厉害

谢谢啦!

马黑黑 发表于 2022-7-12 20:21

加林森 发表于 2022-7-12 20:20
谢谢啦!

嗯,谢谢小辣椒
页: [1] 2
查看完整版本: 《小步舞曲》- 巴赫 大家来跳舞!