加林森 发表于 2022-7-24 14:17

《美丽的神话【竹笛】》- 笛子绿洲（学习老黑的‘江河水’制作）

本帖最后由 加林森 于 2022-7-24 17:24 编辑 <br /><br /><style>
#papa { left: -242px; width: 1080px; height: 664px; background: gray url('https://pic.imgdb.cn/item/62dcdbbaf54cd3f9372b8524.jpg'); overflow: hidden; box-shadow: 3px 3px 20px #000; position: relative; }
#boat { position: absolute; width: 200px; height: 118px; top: calc(100% - 150px); filter: blur(1px); animation: boating 20s linear infinite; }
#playbox { position: absolute; left: 10px; bottom: 10px; padding: 10px; background: rgba(255,255,255,.2); border-radius: 6px; backdrop-filter: blur(1px); overflow: hidden; box-shadow: 1px 1px 2px rgba(0,0,0,.15); z-index: 100; }
#playbox span { margin-left: 10px; font: normal 1.2em sans-serif; color: #eee; text-shadow: 1px 1px 1px #000; }
#btnplay { width: 30px; height: 30px; border-radius: 50%; outline: none; border: none; }
#btnplay:hover { background: #aaa; color: #ff0000; cursor: pointer; }
@keyframes boating { from { left: 100%; } to { left: -200px; } }
</style>

<div id="papa">
        <img id="boat" src='https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fwww.j6886c.com%2Fimages%2Fup_images%2F201671415858.jpg&refer=http%3A%2F%2Fwww.j6886c.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1661244643&t=4cd203dba4ad8cebd7cede88ca66ac33' alt="" />
        <div id="playbox"><input id="btnplay" type="button" value=">" /><span>美丽的神话【竹笛】 - 笛子绿洲</span></div>
</div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=1420437814.mp3" autoplay="autoplay" loop="loop"></audio>

<script>
btnplay.onclick = () => aud.paused ? aud.play() : aud.pause();
aud.addEventListener('playing', () => btnplay.value = '||');
aud.addEventListener('pause', () => btnplay.value = '>');
</script>

加林森 发表于 2022-7-24 14:17

@马黑黑

红影 发表于 2022-7-24 14:23

队长更好漂亮的制作，欣赏{:4_204:}

加林森 发表于 2022-7-24 14:27

红影 发表于 2022-7-24 14:23
队长更好漂亮的制作，欣赏

刚学习的，试着制作一个出来看效果的。

梦油 发表于 2022-7-24 14:57

欣赏佳作，问候队长。

加林森 发表于 2022-7-24 15:03

梦油 发表于 2022-7-24 14:57
欣赏佳作，问候队长。

老梦下午好！

梦油 发表于 2022-7-24 15:10

加林森 发表于 2022-7-24 15:03
老梦下午好！

你那马还跳着舞步过来的啊！{:4_189:}

马黑黑 发表于 2022-7-24 15:39

让图片这么跑是不是很别扭呢{:4_170:}

醉美水芙蓉 发表于 2022-7-24 15:53

樵歌 发表于 2022-7-24 16:34

乍一看马儿八条腿在跑，其实是马儿跑得风一样快，有四条腿是残影{:4_174:}

加林森 发表于 2022-7-24 16:37

梦油 发表于 2022-7-24 15:10
你那马还跳着舞步过来的啊！

是啊。

加林森 发表于 2022-7-24 16:38

马黑黑 发表于 2022-7-24 15:39
让图片这么跑是不是很别扭呢

我没有办法嘛。只有将就了。{:4_189:}

加林森 发表于 2022-7-24 16:39

醉美水芙蓉 发表于 2022-7-24 15:53
欣赏队长佳作！

谢谢芙蓉！

加林森 发表于 2022-7-24 16:39

樵歌 发表于 2022-7-24 16:34
乍一看马儿八条腿在跑，其实是马儿跑得风一样快，有四条腿是残影

是的。

绿叶清舟 发表于 2022-7-24 16:49

队长真快啊，做得漂亮了

绿叶清舟 发表于 2022-7-24 16:52

https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fwww.j6886c.com%2Fimages%2Fup_images%2F201671415858.jpg&refer=http%3A%2F%2Fwww.j6886c.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1661244643&t=4cd203dba4ad8cebd7cede88ca66ac33

加林森 发表于 2022-7-24 16:53

绿叶清舟 发表于 2022-7-24 16:49
队长真快啊，做得漂亮了

谢谢清舟支持！{:4_190:}

加林森 发表于 2022-7-24 16:54

绿叶清舟 发表于 2022-7-24 16:52


这个好，我就用你这个了哈。谢谢了！

马黑黑 发表于 2022-7-24 16:55

加林森 发表于 2022-7-24 16:38
我没有办法嘛。只有将就了。

下决心弄弄透明背景的图片吧

加林森 发表于 2022-7-24 17:01

马黑黑 发表于 2022-7-24 16:55
下决心弄弄透明背景的图片吧

好的。我的软件还在的。
页: [1] 2 3
查看完整版本: 《美丽的神话【竹笛】》- 笛子绿洲（学习老黑的‘江河水’制作）