清溪度年华，套用马老师代码制作
<style>
@import 'https://638183.freep.cn/638183/web/api/audioplayer.css';
.pa { --offsetX: 81px; --bg: url('https://ff.xiaoqiaodali.top:5401/i/2026/08/21/6a883c09631cc.gif') no-repeat center/cover; color: lightgreen; }
.player { width: 460px; left: 20px; bottom: 10px; }
.btnFs { top: 25px; right: 20px; }
.pd-vid { left: 0;top: 50%; width: 50%; height: 50%; opacity: 0.5; mix-blend-mode: screen; }
/* 六叶草：底部居中，位于歌词上方 */
#msvg {
position: absolute;
bottom: 60px;
left: 50%;
margin-left: -6vw;
width: 12vw;
height: 12vw;
transition: .6s;
z-index: 10;
}
/* 歌词：底部居中、单行显示 */
#lrc {
position: absolute;
bottom: 20px;
left: 0;
width: 100%;
text-align: center;
color: #ffffff;
font-size: 28px;
font-family: "微软雅黑", "Microsoft YaHei", sans-serif;
text-shadow: 0 0 0px rgba(0,0,0,.0), 0 0 0px rgba(0,0,0,.0);
pointer-events: none;
z-index: 10;
--color1: #54FF9F;
--color2: #ffffff;
}
</style>
<div id="pa" class="pa">
<video class="pd-vid" src="https://img2.tukuppt.com/video_show/2269348/00/17/44/5ec497a38f522.mp4" autoplay loop muted></video>
<svg id="msvg" class="rot" viewBox="-200 -200 400 400"><title>播放/暂停(Alt+X)</title></svg>
</div>
<script>
// LRC 歌词（ 为时间标签，请替换为《僻静小路》的真实歌词）
var geci = `清溪度年华
清溪度年华
作词 尚文歌集
作曲 尚文歌集
青山笼晓雾烟缠古枝桠
清泉出石涧顺势向低崖
遇石知迂回润物远嚣哗
长携碧玉色悠远向远遐
漫堤拂野芳清涧绕人家
晨起掬清泉甘泽润桑麻
一泓涤尘浊心静少牵挂
青光伴岁月自在度年华
山涧流水缓缓漫烟霞
趟过山谷温润洗尘杂
顺流而行随心而下
一身清澈不染浮华
山涧流水悠悠有风华
趟过郊野温润护人家
心随清波向远而下
一身淡然自在无涯
不逐狂不矜夸
顺势去自无涯
以柔软磨顽石
以清宁洗岁华
山涧流水缓缓漫烟霞
趟过山谷温润洗尘杂
顺流而行随心而下
一身清澈不染浮华
山涧流水悠悠有风华
趟过郊野温润护人家
心随碧波向远而下
一身澄然自在天涯
清波逐影向远而下
一身澄然自在天涯`;
var options = {
pa: '.pa',
urls: [['https://imgimg.qqdsw8.cn/view.php/c1e8f5cd854e7715fbd74fb45b3b294f.mp3']],
btns: ,
};
loadJs('https://638183.freep.cn/638183/web/api/audioplayer.min.js', function() {
loadJs('https://638183.freep.cn/638183/web/api/yslrc.min.js', function() {
loadJs('https://638183.freep.cn/638183/svgdr/svgdr.min.js', tzRun);
});
});
function tzRun() {
var aud = new AudPlayer(options);
var dr = _dr(msvg);
dr.path(dr.clover({num: 6, r: 160, gap: 1, R: 260}), 'currentColor');
LRC(aud.pa, aud.aud, geci);
}
function loadJs(url, callback) {
var script = document.createElement('script');
script.charset = 'utf-8';
script.src = url;
script.onload = function() {
if (callback) callback();
};
document.head.appendChild(script);
}
</script> 风景真漂亮，歌词很有特色，欣赏学习点赞！{:4_187:} 欣赏美帖！ 赞！ 梦江南 发表于 2026-8-22 07:36
风景真漂亮，歌词很有特色，欣赏学习点赞！
梦江南上午好~~这首歌是刚发布的，作者诠释了上善若水的内涵，我挺喜欢的，感谢你的支持，祝安好！{:4_204:}{:4_190:}
夕阳黄昏 发表于 2026-8-22 07:45
欣赏美帖！ 赞！
夕阳黄昏上午好~~感谢您的鼓励！气候反常，请多保重，恭祝安好！{:4_204:}{:4_190:}
字幕设计与众不同，很巧妙。枫丹朋友的制作水平十分了得。
问好霜染枫丹朋友。 梦油 发表于 2026-8-22 10:18
字幕设计与众不同，很巧妙。枫丹朋友的制作水平十分了得。
问好霜染枫丹朋友。
感谢梦老的支持！这是马老师一个新玩法，我挺喜欢的。得到支持很高兴，祝您秋安！{:4_204:}{:4_190:}
制作漂亮，歌曲好听。欣赏枫丹好帖{:4_187:} 霜染枫丹 发表于 2026-8-22 11:35
感谢梦老的支持！这是马老师一个新玩法，我挺喜欢的。得到支持很高兴，祝您秋安！
你制作的东西比电视台播放的小片不差 欣赏佳作，点赞！
流动的字幕很有意思，好创意。{:4_178:} 好听好看，谢谢枫丹老师精彩分享{:4_204:} 梦油 发表于 2026-8-22 10:18
字幕设计与众不同，很巧妙。枫丹朋友的制作水平十分了得。
问好霜染枫丹朋友。
梦老晚上好~~
感谢您的鼓励！我贪玩，马老师有新样式我就想跟着学习一下。祝您秋安！{:4_204:}{:4_190:}
魏淑芬 发表于 2026-8-22 15:13
欣赏佳作，点赞！
流动的字幕很有意思，好创意。
魏淑芬晚上好~~
马老师这个六叶草我挺喜欢的，感谢您的支持鼓励，祝您秋安！{:4_204:}{:4_190:}
杨帆 发表于 2026-8-22 18:14
好听好看，谢谢枫丹老师精彩分享
感谢扬帆的支持，晚上好！这首歌是尚文歌集的新作。就选用了。祝您秋日吉祥！！{:4_204:}{:4_190:}
尚文歌集的作品挺好听呢，改天选用一个玩一下{:4_204:} 霜染枫丹 发表于 2026-8-22 19:38
梦老晚上好~~
感谢您的鼓励！我贪玩，马老师有新样式我就想跟着学习一下。祝您秋安！{:4_190 ...
你这样的心态很难得，老年人就要这样。这是长寿的必要条件之一。祝愿枫丹朋友天天开心、时时欢乐。 制作精美，赏心悦目好看，好制作。{:4_204:} 玫瑰 发表于 2026-8-28 17:51
制作精美，赏心悦目好看，好制作。
马老师的这组代码很别致，我挺喜欢的。感谢玫瑰的支持，下午好！{:4_204:}{:4_190:}
页:
[1]