风里的歌 -- 帖赠:走过岁月 (套用黑黑Club Gtr播放器效果)
<style>@import 'https://638183.freep.cn/638183/web/css/tz02.css';
#pa {margin: 130px 0;
position: relative;
display: grid;
place-items: center; --offsetX: 81px; --bg: url('https://wj.zp68.com/lxx/yunhua/2025/08/30/28.jpg') no-repeat center/cover; --ma-size: 12%; }
#ma {top: 30%; right: 40%; background: url('https://638183.freep.cn/638183/small/hh1.webp') no-repeat center/cover; filter: sepia(1); transition: .75s; }
#ma:hover { filter: unset; }
#btnFs { left: 30px; bottom: 30px; color: beige; border-color: currentColor!important; }
#lrc {right: 8%;top: 100px; letter-spacing: 4px; writing-mode: vertical-rl; font:normal 2.0em Microsoft YaHei; sans-serif; color:DarkKhaki;}
#lrc::before { width: 100%; height: 0; background: url('https://xlaj.cn/assets/file/zp/20240118150805.gif ') center; background-clip: text;-webkit-background-clip: text; }
@keyframes cover1 { from { height: 0; }to { height: 100%; } }
@keyframes cover2 { from { height: 0; }to { height: 100%; } }
</style>
<div id="pa">
<audio id="audio" src="https://wj.zp68.com/lxx/yunhua/2025/08/30/fldg.mp3" autoplay loop></audio>
<video class="pd-vid vid" src="https://wj.zp68.com/lxx/yunhua/2025/08/30/clip.mp4" autoplay loop muted></video>
<div id="ma">
<svg id="msvg" width="100%" height="100%" viewBox="-100 -100 200 200"></svg>
</div>
</div>
<script type="module">
import { FS } from 'https://638183.freep.cn/638183/web/js/fullscreen.js';
import Dr from 'https://638183.freep.cn/638183/web/mod/svgdr.js';
import lrc from 'https://638183.freep.cn/638183/web/lrc/hclrc_only.js';
var geci = [['0.00', '《风里的歌》',6.89],
['8.31', '帖赠:走过岁月',4.25],
['12.78', '演唱:林琼珑',5.88],
['18.97', '词 曲:林琼珑',6.04],
['26.38', '看着身边朋友四散离去',4.46],
['32.13', '有些悲伤却只能沉默不语',4.60],
['39.08', '心里知道 从此已有了距离',4.65],
['45.03', '我们再也不能 不能回到过去',5.71],
['52.09', '现在我想在风里唱歌',4.86],
['58.26', '再唱一首我们的歌',5.50],
['65.10', '有些话想对你说 ',2.18],
['67.39', '却都没有说',3.54],
['71.12', '可是从前我们 ',2.29],
['73.53', '我们在乎过什么',5.81],
['79.65', '那时候在风里唱歌 ',3.62],
['83.46', '唱我们的歌',3.20],
['86.83', '在风里唱歌 ',2.66],
['89.63', '从不在乎别人如何',3.53],
['93.35', '在风里唱歌 ',2.63],
['96.12', '有过梦也有失望的时候',3.48],
['99.78', '在风里唱歌 如果你听到 ',3.80],
['103.78', '你会不会跟我轻轻的和',5.64],
['109.72', '歌词同步编辑:小辣椒',28.22],
['139.43', '现在我想在风里唱歌',5.81],
['145.55', '再唱一首我们的歌',5.55],
['152.44', '有些话想对你说 ',2.01],
['154.56', '却都没有说',2.88],
['157.59', '可是从前我们 ',3.04],
['160.79', '我们在乎过什么',5.86],
['166.96', '那时候在风里唱歌 ',3.71],
['170.86', '唱我们的歌',3.26],
['174.29', '在风里唱歌 ',2.63],
['177.06', '从不在乎别人如何',3.48],
['180.72', '在风里唱歌 ',2.66],
['183.52', '有过梦也有失望的时候',3.46],
['187.16', '在风里唱歌 如果你听到 ',3.85],
['191.21', '你会不会跟我轻轻的和',5.72],
['199.34', '那时候在风里唱歌 ',3.64],
['203.17', '唱我们的歌',3.33],
['206.68', '在风里唱歌',2.64],
['209.46', ' 从不在乎别人如何',3.52],
['213.17', '在风里唱歌 ',2.62],
['215.93', '有过梦也有失望的时候',3.36],
['219.47', '在风里唱歌 如果你听到 ',3.84],
['223.51', '你会不会跟我轻轻的和',5.88],
['231.80', '那时候在风里唱歌 ',3.61],
['235.60', '唱我们的歌',3.21],
['238.98', '在风里唱歌 ',2.78],
['241.91', '从不在乎别人如何',3.42],
['245.51', '在风里唱歌 ',2.60],
['248.25', '有过梦也有失望的时候',3.55],
['251.99', '在风里唱歌 如果你听到 ',3.70],
['255.88', '你会不会跟我轻轻的和',5.69],
['262.92', '',4.5]
];
lrc(pa, geci)
var dr = Dr.dr(msvg);
var tt = 10, path = 'M0 -30,-20 0,0 -95,20 0 Z';
Array.from({length: tt}).forEach((_,k) => {
dr.path(path, 'none', 'beige', 3).transform(`rotate(${360/tt*k})`);
});
FS(pa,ma);
</script> @走过岁月
感谢岁月的AE制作,小辣椒直接玩一次,{:4_205:} @马黑黑
感谢黑黑源码分享,小辣椒直接套用玩一个,做帖是很快的,被这个播放器图图难住了,找了好几个出来效果都不漂亮,还是黑黑的漂亮,直接用了黑黑的了{:4_170:} 这个播放器真漂亮哎! 梦油 发表于 2025-8-30 21:18
这个播放器真漂亮哎!
梦油晚上好,这个是套用黑黑的代码制作,小辣椒现在很多不会了 小辣椒 发表于 2025-8-30 21:13
@走过岁月
感谢岁月的AE制作,小辣椒直接玩一次,
来了 走过岁月 发表于 2025-8-30 21:20
来了
岁月晚上好{:4_187:} 风里的歌,飘荡的蒲公英,很切题 版面设计的很好 谢谢小辣椒 走过岁月 发表于 2025-8-30 21:22
风里的歌,飘荡的蒲公英,很切题
很喜欢的一首歌,这个画面是你设计的效果{:4_170:} 走过岁月 发表于 2025-8-30 21:23
版面设计的很好
就做了个图,加了歌词同步进去 走过岁月 发表于 2025-8-30 21:24
谢谢小辣椒
干嘛这么客气,其实都是你的东西{:4_205:} 画面好漂亮,左侧朦胧女子身影很飘逸,蒲公英也很漂亮。
欣赏亲爱的好帖,岁月收礼开心{:4_199:} 这歌词同步还是变色的呢,特别漂亮{:4_199:} 谢谢小辣椒精彩制作,祝走过岁月版主收礼开心{:4_191:} 小辣椒 发表于 2025-8-30 21:15
@马黑黑
感谢黑黑源码分享,小辣椒直接套用玩一个,做帖是很快的,被这个播放器图图难住了,找了好几个 ...
平时注意收集小图片,用的时候可选择的余地会很大。 蓝色系主色,飘飞的蒲公英,隐现的人影,营造出了妙不可言的音画环境。好帖。 漂亮!这个小播中间还加了网条,最喜欢旁边变色的歌词了。小辣椒厉害!{:4_187:} 欣赏老师的精彩制作{:5_116:}{:5_116:}{:5_116:}