五百年桑田沧海
本帖最后由 月明工作室 于 2026-5-22 17:52 编辑 <br /><br /><style>@import 'https://638183.freep.cn/638183/web/api/audioplayer.css';
.pa { --offsetX: 91px; --bg: url('http://cccimg.com/view.php/3134c5c209f2f9da7b492b2c56307f58.png') no-repeat center/cover; color: lightgreen; }
.player { width: 480px; bottom: 20px; }
.btnFs { top: 25px; right: 20px; }
.pd-vid { opacity: 1; mix-blend-mode: screen; }
#lrc { top: 780px; }
#msvg { position: absolute; left: 30px; width: 1vw; heighht: 1vw; transition: .165s; opacity: var(--opacity); }
</style>
<div id="pa" class="pa">
<video class="pd-vid" src="https://img2.tukuppt.com/video_show/2432605/00/01/90/5b4e19ad0aab7.mp4" autoplay loop muted></video>
<svg id="msvg" xmlns="http://www.w3.org/2000/svg" viewBox="-200 -200 400 400">
<g id="g1" class="rotate brightness">
<title>播放/暂停(Alt+X)</title>
<circle cx="0" cy="0" r="190" fill="transparent"></circle>
</g>
</svg>
</div>
<script>
var gc = `五百年桑田沧海 - 王立军\n词：阎肃\n曲：许镜清\nLRC歌词编辑：明月工作室\n五百年桑田沧海\n顽石也长满青苔\n长满青苔\n只一颗心儿未死\n向往着逍遥自在\n逍遥自在\n哪怕是野火焚烧\n哪怕是冰雪覆盖\n依然是志向不改\n依然是信念不衰\n蹉跎了岁月\n伤透了情怀\n为什么为什么\n偏有这样的安排\n五百年桑田沧海\n顽石也长满青苔\n长满青苔\n只一颗心儿未死\n向往着逍遥自在\n逍遥自在\n哪怕是野火焚烧\n哪怕是冰雪覆盖\n依然是志向不改\n依然是信念不衰\n蹉跎了岁月\n激荡了情怀\n为什么为什么\n偏有这样的安排\n为什么为什么\n偏有这样的安排\n-- 谢谢欣赏 --`;
var options = {
pa: '.pa',
urls: [['http://cccimg.com/view.php/f29a04404287421d2705d5b3acbc44d3.mp3', '缘浅何必苦相守']],
btns: ,
};
loadJs('https://638183.freep.cn/638183/web/api/audioplayer.min.js?v0', 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);
LRC(aud.pa, aud.aud, gc, 0.5);
var dr = _dr(msvg);
dr.path('M0 -190 Q-50 -150,15 0 Q50 -100,0 -190Z', 'transparent', 'lightgreen', 1).addTo(g1).rotates(10,360);
function setPathFill() {
var paths = msvg.querySelectorAll('path');
paths.forEach(path => path.setAttribute('fill', `#${Math.random().toString().substring(2,8)}`));
};
setPathFill();
}
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>
明月老师这个音画合一，做得非常完美！ 谢谢老师分享精彩！ 漂亮~谢谢月明精彩分享 醉美水芙蓉 发表于 2026-5-22 20:27
明月老师这个音画合一，做得非常完美！
问好芙蓉老师谢谢支持！ klxf 发表于 2026-5-22 21:49
漂亮~谢谢月明精彩分享
问好klxf老师谢谢支持！
页:
[1]