加林森 发表于 2022-3-17 23:52

本帖最后由 加林森 于 2022-5-18 13:48 编辑 <br /><br />红影 发表于 2022-3-17 23:31
准备下了,队长晚安
好的,晚安红影!{:4_204:}

<style>
.stage{
        margin: auto;
        position: relative;
        left: -305px;
        width: 1200px;
        height: 600px;
        background:#666 url('https://pic.imgdb.cn/item/628481af0947543129175d8f.jpg');
        perspective: 3000px;
        perspective-origin: 50% 50%;
        cursor: pointer;
}
.stage::before {
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        background: url('https://638183.freep.cn/638183/Pic/2022/smoke1.gif') no-repeat center/cover;
        opacity: .1;
}
.circle {
        --x: 80px;
        position: absolute;
        width: var(--x);
        height: var(--x);
        right: 20px;
      top: 20px;
        transform-style: preserve-3d;
        animation: rot 5s linear infinite;
}
.circle div {
        position: absolute;
        width: 100%;
        height: 100%;
        border: 1px solid DeepPink;
        border-radius: 50%;
        padding: 0;
}
.circle div:nth-child(1){ transform:rotateY(0deg);}
.circle div:nth-child(2){ transform:rotateY(30deg);}
.circle div:nth-child(3){ transform:rotateY(60deg);}
.circle div:nth-child(4){ transform:rotateY(90deg);}
.circle div:nth-child(5){ transform:rotateY(120deg);}
.circle div:nth-child(6){ transform:rotateY(150deg);}
@keyframes rot{
        0%{ transform: rotateZ(30deg) rotateY(0turn);}
        100%{ transform: rotateZ(30deg) rotateY(1turn);}
}
</style>

<div class="stage">
        <div class="circle">
                <div></div>
                <div></div>
                <div></div>
                <div></div>
                <div></div>
                <div></div>
        </div>
</div>

<script>
var au = document.createElement('audio');
au.src = 'http://www.kumeiwp.com/sub/filestores/2022/05/18/1291f3f8f13846b1b802bacf8e1048e5.mp3';
au.loop = true;
au.autoplay = true;
document.querySelector('.stage').appendChild(au);
document.querySelector('.circle').onclick = function() {
        au.paused ? (au.play(), this.style.animationPlayState = 'running') : (au.pause(), this.style.animationPlayState = 'paused');
}
</script>

东篱闲人 发表于 2022-3-18 09:03

加林森 发表于 2022-3-17 21:36
抛去了会再来,皇上威力大。。。

良性经济循环?{:5_117:}

加林森 发表于 2022-3-18 09:55

东篱闲人 发表于 2022-3-18 09:03
良性经济循环?

你早知道的,所以嘛你挺那个啥的。。。。{:4_172:}

东篱闲人 发表于 2022-3-18 10:59

加林森 发表于 2022-3-18 09:55
你早知道的,所以嘛你挺那个啥的。。。。

啥?{:5_115:}

樵歌 发表于 2022-3-18 11:40

加林森 发表于 2022-3-17 20:54
哈哈,樵歌晚上好。小娃娃是播放器,彩字是用代码制作的。

创意无限好,只是我{:4_203:}不会

加林森 发表于 2022-3-18 12:25

樵歌 发表于 2022-3-18 11:40
创意无限好,只是我不会

你欣赏就行了嘛。{:4_189:}

加林森 发表于 2022-3-18 12:32

东篱闲人 发表于 2022-3-18 10:59
啥?

啥就是那个钞票大大的有。{:4_189:} 老兄,我送你应该帖了,快去收礼,希望你开心。

东篱闲人 发表于 2022-3-18 13:25

加林森 发表于 2022-3-18 12:32
啥就是那个钞票大大的有。 老兄,我送你应该帖了,快去收礼,希望你开心。

跑着去。。。{:4_187:}

樵歌 发表于 2022-3-18 19:40

加林森 发表于 2022-3-18 12:25
你欣赏就行了嘛。

这个我倒是省事儿了{:4_174:}

加林森 发表于 2022-3-18 21:27

樵歌 发表于 2022-3-18 19:40
这个我倒是省事儿了

就是嘛,欣赏就完了。
页: 1 2 [3]
查看完整版本: 《虞美人》-- 弹奏:马常胜