非常棒
谢谢!
<style>
#papa { left: -214px; width: 1024px; height: 640px; background: teal url('https://pic.imgdb.cn/item/62e27777f54cd3f937a1223d.gif') no-repeat center / cover; perspective: 2000px; box-shadow: 4px 4px 24px #000; position: relative; }
#wrapper { position: relative; width: 100px; height: 100px; left: 40%; top: 60%; transform-style: preserve-3d; transform: rotateX(-20deg) rotateY(-20deg); cursor: pointer; }
#mypic { position: absolute; width: 100px; height: 100px; transform: translateZ(50px) translateY(100px) translateX(50px); }
#wrapper>span:nth-child(1) { transform: translateZ(100px); background: teal; }
#wrapper>span:nth-child(2) { transform: translateZ(-100px); background: lightgreen; }
#wrapper>span:nth-child(3) { transform: translateX(-100px) rotateY(90deg); background: skyblue; }
#wrapper>span:nth-child(4) { transform: translateX(100px) rotateY(90deg); background: green; }
#wrapper>span:nth-child(5) { transform: translateY(-100px) rotateX(90deg); background: olive; }
#wrapper>span:nth-child(6) { transform: translateY(100px) rotateX(90deg); background: tan; }
.panel { position: absolute; width: 200px; height: 200px; text-align: center; opacity: .95;}
</style>
<div id="papa">
<div id="wrapper">
<span class="panel"></span>
<span class="panel"></span>
<span class="panel"></span>
<span class="panel"></span>
<span class="panel"></span>
<span class="panel"></span>
<img id="mypic" src="https://pic.imgdb.cn/item/62e27609f54cd3f937984912.gif" alt="" />
</div>
</div>
<script>
let aud = new Audio();
aud.loop = true;
aud.src = 'https://music.163.com/song/media/outer/url?id=1915271601.mp3';
let panel = document.querySelector('.panel');
wrapper.onclick = () => panel.style.display == 'none' ? (panel.style.display = 'block', aud.pause()) : (panel.style.display = 'none',aud.play());
</script>
加林森 发表于 2022-5-13 20:41
没关系的,没有分就说明你很努力给别人在加分了,辛苦了!
谢谢你的理解。 梦油 发表于 2022-5-14 14:21
谢谢你的理解。
我知道的嘛,我也经常没有分给别人加的,
页:
1
[2]