论坛 › 欢乐水吧 › 明镜菩提 to 东篱闲人

红影 发表于 2022-3-16 21:43

明镜菩提 to 东篱闲人

<style>

#bgBox { position:relative; left: -15px; width: 790px; height: 430px; background-image: url('https://pic.imgdb.cn/item/62328db85baa1a80ab22406e.jpg'); background-size: 790px 430px; background-

position: 790px 0; opacity: .75; animation: mv 28s linear infinite; }
#clkBtn { width: 100px; height: 100px; border-radius: 50%; background: rgba(0, 0, 0, .8); cursor: pointer;

position: relative; }
#clkBtn::before { content: ''; position: absolute; left: 5px; top: 5px; background: rgba(0, 0, 0, .2);

width: 88px; height: 88px; border: 1px solid #555; border-radius: 50%; }
#zhizhen { position: absolute; left: 50px; top: 50px; width: 2px; height: 44px; background: red;

transform-origin: 0 0; animation: go 3s linear infinite; }
@keyframes go { to { transform: rotate(360deg);} }
@keyframes mv { from { background-position: 790px 0; } to { background-position: 0 0; } }

</style>

<div id="bgBox">
<div style="position: absolute; left:90px; top: 10px; width:688px; height: 80px;text-align:center;">
      <img alt="" src="http://image.hnol.net/c/2020-12/25/10/202012251011032731-5088534.gif"/></div>
      <div id="clkBtn" style="left: 20px; top: calc(100% - 120px);">
                <div id="zhizhen"></div>
      </div>
      <audio id="music" autoplay="autoplay" loop="loop" src="http://music.163.com/song/media/outer/url?

id=488664116.mp3" ></audio>
</div>

<script language="javascript">
var aud = document.getElementById('music');
var btn = document.getElementById('clkBtn');
var zz = document.getElementById('zhizhen');
btn.onclick = function(){ aud.paused ? (aud.play(), zz.style.animationPlayState = "running") : (aud.pause

(), zz.style.animationPlayState = "paused"); }
aud.addEventListener("ended", function(){ zz.style.animationPlayState = "running"; });
</script>

红影 发表于 2022-3-16 21:44

刚学的，简单回个礼。感谢东篱大哥的好礼{:4_187:}@东篱闲人

加林森 发表于 2022-3-16 21:54

红影这个制作融和得好。{:4_199:}

千羽 发表于 2022-3-16 22:04

影子出图了，浓浓的古韵味，美美哒{:4_199:}

千羽 发表于 2022-3-16 22:05

雪中的园景更有风彩啊{:4_205:}

千羽 发表于 2022-3-16 22:06

影子做的精彩，送花花和香茶啦{:4_187:}{:4_204:}{:4_180:}

大猫咪 发表于 2022-3-16 22:10

红影这个场景找的真棒，音乐图片融的一流，意境出来了，赞！

老头收礼开心！

{:4_204:}{:4_190:}

好开心 发表于 2022-3-16 23:11

这个用手机电脑版只能看到秒表在走，音乐倒是有，手机版能看左边一半图

好开心 发表于 2022-3-16 23:12

何处惹尘埃？

加林森 发表于 2022-3-16 23:12

好开心 发表于 2022-3-16 23:11
这个用手机电脑版只能看到秒表在走，音乐倒是有，手机版能看左边一半图

电脑上看更加舒服的。

好开心 发表于 2022-3-16 23:22

加林森 发表于 2022-3-16 23:12
电脑上看更加舒服的。

家里台式电脑坏了，明天用手提电脑

加林森 发表于 2022-3-16 23:24

好开心 发表于 2022-3-16 23:22
家里台式电脑坏了，明天用手提电脑

嗯嗯，很美的。欣赏吧！

马黑黑 发表于 2022-3-16 23:45

这不是传说中的后宫一景吗{:5_117:}

腻害，各种元素搭配很不错，美美哒。东篱收礼开森

小九 发表于 2022-3-17 09:42

影子学得好快啊{:4_199:}

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

阿弥陀佛，漂亮漂亮！{:4_187:}

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

红影 发表于 2022-3-16 21:44
刚学的，简单回个礼。感谢东篱大哥的好礼@东篱闲人

意境悠然，诗情画意。。。{:5_116:}

马黑黑 发表于 2022-3-17 14:11

东篱闲人 发表于 2022-3-17 13:17
意境悠然，诗情画意。。。

嗯，怎么看怎么舒服

东篱闲人 发表于 2022-3-17 15:35

马黑黑 发表于 2022-3-17 14:11
嗯，怎么看怎么舒服

{:4_174:}

东篱闲人 发表于 2022-3-17 15:36

大猫咪 发表于 2022-3-16 22:10
红影这个场景找的真棒，音乐图片融的一流，意境出来了，赞！

老头收礼开心！

开心开心，就爱收礼。。。{:4_170:}

东篱闲人 发表于 2022-3-17 15:37

马黑黑 发表于 2022-3-16 23:45
这不是传说中的后宫一景吗

腻害，各种元素搭配很不错，美美哒。东篱收礼开森

后宫你常去啊？{:5_117:}

查看完整版本: 明镜菩提 to 东篱闲人