本帖最后由 加林森 于 2022-4-9 13:22 编辑 <br /><br />红影 发表于 2021-9-5 14:14
看到了，给队长点赞
嗯嗯，谢谢！
<style>
.stage{
margin: auto;
position: relative;
left: -302px;
width: 1200px;
height: 800px;
background: #666 url('https://pic.imgdb.cn/item/62510a06239250f7c595c05e.jpg') no-repeat center/cover;
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 skyblue;
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/02/04/f1cbff6ee687ca557f25abf094509485.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>
加林森 发表于 2021-9-6 22:36
嗯嗯，谢谢！
隊長又是這麼晚啊。影子準備休息了，隊長晚安{:4_204:}
红影 发表于 2021-9-6 22:55
隊長又是這麼晚啊。影子準備休息了，隊長晚安
好的好的，影子晚安！
晚安，好梦！拜~~~~~~~~~~~
发财发财
马黑黑 发表于 2021-9-9 07:34
发财发财
发什么财？
加林森 发表于 2021-9-9 19:53
发什么财？
发梦里的财
本帖最后由 加林森 于 2021-10-22 19:44 编辑
准备睡觉了，各位还在的朋友都休息吧！
大家明天见！晚安，祝大家好梦！