昨夜星辰 帖赠：清茶煮雪（学习黑黑千古绝唱播放器效果）

小辣椒

小辣椒

@清茶煮雪

雪儿不好意思做个作业当礼物了，别嫌弃啊

小辣椒

@马黑黑

黑黑，我昨天晚上试了按你的备注我去测试了，JS里面我不会修改，后来二个图片效果出来了，播放器没有了，今天还是按昨天的制作发了，以后再重新学习过了

小辣椒

反正感觉没有系统学习要完全想自己的效果一下子是做不出来了

马黑黑

小辣椒 发表于 2025-11-27 21:18
@马黑黑

黑黑，我昨天晚上试了按你的备注我去测试了，JS里面我不会修改，后来二个图片效果出来了，播放 ...

JS操作元素，需要对应元素的id，昨天给的示例，[vid, ipic, ipic1]，分别对应于视频标签id（vid）、图片之一id(ipic）、图片之二id（ipic1），后面的语句不用改，只需要确保HTML元素的id都再 [...] 里面。

HTML各元素的id，对应CSS里的 id 选择器 #id，例如：

<img id="ipic" src="..." />

应再 CSS 里有：

#ipic { width: 200px; height: 200px; ... }

CSS 制定HTML元素的样式（例如上面的宽高设置），JS 对元素做相关操作（例如点击元素可以暂停/播放、播放音乐）。

CSS、HTML、JS 是做H5帖子的三件套，彼此间的关系弄清楚，就能在做帖时得心应手，稀里糊涂的认知只会无端消耗时间和精力。

霜染枫丹

很喜欢的歌曲，很精致的画面，点赞！

樵歌

你总是做得那么好那么好
令我心驰神往也傲骄
小辣椒 小辣椒
你音画全都那么的妙
不得了，不得了
我咧嘴，大声地笑

菲儿

打开窗口就听见“昨夜星辰”一首非常经典的歌曲 听着歌曲想起小时候的欢乐时光

菲儿

一百二十分的遗憾 这里每次的代码贴我都看不到特效，我这里看见的是静止的画面，还好能听见歌曲，应该是我浏览器的原因 ，但这电脑不能去设置。抽空用家里电脑来欣赏。

菲儿

小辣椒 发表于 2025-11-27 21:15
@清茶煮雪

雪儿不好意思做个作业当礼物了，别嫌弃啊

谢谢亲爱滴小辣椒 好喜欢的夜景图图和歌曲很搭配，听歌赏图想起了那绚丽多彩的昨夜星辰 ~

菲儿

小辣椒 发表于 2025-11-27 21:15
@清茶煮雪

雪儿不好意思做个作业当礼物了，别嫌弃啊

循环听了很久，手机看见了漂亮的播发器，小辣椒你咋这么优秀 学到了黑黑老师的技术 给你点赞！
谢谢你的礼物 我很喜欢，

菲儿

小辣椒 发表于 2025-11-27 21:19
反正感觉没有系统学习要完全想自己的效果一下子是做不出来了

你已经制作得很好了，我还不会呢
给你送花制作辛苦啦，祝开心快乐！

红影

这背景制作很漂亮，配上这样的播放器更美了，非常漂亮。
给亲爱的制作点赞，雪儿收礼开心

杨帆

漂亮~谢谢小辣椒精彩分享，祝清茶收礼开心

小辣椒

霜染枫丹 发表于 2025-11-27 22:45
很喜欢的歌曲，很精致的画面，点赞！

谢谢枫丹老师欣赏

小辣椒

樵歌 发表于 2025-11-28 07:20
你总是做得那么好那么好
令我心驰神往也傲骄
小辣椒 小辣椒

樵哥哥晚上好，你要笑S我啊

小辣椒

清茶煮雪 发表于 2025-11-28 10:11
打开窗口就听见“昨夜星辰”一首非常经典的歌曲 听着歌曲想起小时候的欢乐时光

雪儿晚上好，已经分享过几次的歌了，特别那首电子琴的纯音的昨夜星辰我最喜欢了


昨夜星辰_(DJ电子琴)  演奏；李添兵
https://www.huachaowang.com/foru ... 09&fromuid=4275
(出处: 花潮论坛)

小辣椒

清茶煮雪 发表于 2025-11-28 10:12
一百二十分的遗憾 这里每次的代码贴我都看不到特效，我这里看见的是静止的画面，还好能听见歌曲， ...

雪儿这里没有加特效，我这个是只加了几颗星星的动图，只是播放器是视频，有的手机会看不见，我手机可以看见播放器点击声音就出来了

小辣椒

清茶煮雪 发表于 2025-11-28 10:25
你已经制作得很好了，我还不会呢
给你送花制作辛苦啦，祝开心快乐！

不客气，这个是我的作业，还有许多应该修改的方面，只能慢慢来了，许多黑黑教程我没有学习的

小辣椒

红影 发表于 2025-11-28 13:40
这背景制作很漂亮，配上这样的播放器更美了，非常漂亮。
给亲爱的制作点赞，雪儿收礼开心

亲爱的，其实这个是我动图改的jpg再加星星的动图，比较简单，也是节约时间