醉美水芙蓉 发表于 2026-5-31 21:53:16

我想你的眼里只有我

<meta charset="utf-8">
<style>
    @import 'https://638183.freep.cn/638183/web/api/audioplayer.css';
    .pa { --offsetX: 100px; --bg: url('https://img-baofun.zhhainiao.com/pcwallpaper_ugc/live/357061c86263aa40e33447f269d08633.jpg') no-repeat center/cover; color: white; }
    .player { width: 480px; left: 350px; bottom: 10px; }
    .btnFs { top: 25px; right: 20px; }
    #msvg { position: absolute; width: 10vw; heighht: 10vw; transition: .75s; opacity: var(--opacity); left: 10%; }
#lrc {
--bg: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.50),
    rgba(255, 255, 255, 0.85)
);

position: absolute;
left: 29%;
bottom: 13%;
font: normal 2.0em Microsoft YaHei, sans-serif;
color: transparent;
background: var(--bg);
-webkit-background-clip: text;
background-clip: text;
filter: drop-shadow(1px 1px 2px hsla(0, 100%, 0%, .85));
pointer-events: none;
z-index: 900;

-webkit-mask-image: linear-gradient(to right, #000 0%, #000 0%, transparent 0%);
mask-image: linear-gradient(to right, #000 0%, #000 0%, transparent 0%);
}

</style>

<div id="pa" class="pa">
    <video class="pd-vid" src="https://img2.tukuppt.com/video_show/2414777/00/02/13/5b514e39921d5.mp4" autoplay loop muted></video>
    <svg id="msvg" xmlns="http://www.w3.org/2000/svg" viewBox="-200 -200 400 400">
      <g id="g1" class="rot brightness">
            <title>播放/暂停(Alt+X)</title>
      </g>
    </svg>
<div id="lrc"></div>
</div>

<script>

const LRC_TEXT = ` 不吃香菜 - 我想你的眼里只有我
LRC编辑：醉美水芙蓉
晚风轻轻吹过巷口
我的心事被你看透
多想时光能为你停留
每分每秒都足够
你走过人海和烟火
万千风景都略过
我悄悄把温柔藏心窝
只盼你能看见我
我想你的眼里只有我
看遍世间繁华也不闪躲
所有心动都为你执着
再也没有别的选择
我想你的心里只装我
漫漫长路陪我一起过
这份偏爱不用去猜测
余生有你就够了
星星点亮夜色轮廓
你的名字反复诉说
不用太多华丽的承诺
简单陪伴就很快乐
别人目光都算什么
我的世界因你闪烁
只想握紧你温暖的手
从此不再有寂寞
我想你的眼里只有我
看遍世间繁华也不闪躲
所有心动都为你执着
再也没有别的选择
我想你的心里只装我
漫漫长路陪我一起过
这份偏爱不用去猜测
余生有你就够了
谢谢欣赏
`;

function parseLines(text){
const out=[];
text.trim().split('\n').forEach(l=>{
    const m=l.match(/^\[(\d+):(\d+\.\d+)\]\s*(.*)$/);
    if(!m)return;
    out.push({ t: +m*60 + +m, txt: m });
});
return out;
}
const lines = parseLines(LRC_TEXT);
for(let i=0;i<lines.length;i++){
lines.tEnd = (i+1 < lines.length) ? lines.t : (lines.t + 4);
}
var options = {
pa:'.pa',
urls:[['https://upfile.mp3.wf/view.php/9e2de098c538afab7ebc297fa46c1c02.mp3','我想你的眼里只有我']],
btns:,
};
loadJs('https://638183.freep.cn/638183/web/api/audioplayer.min.js?v0', function(){
loadJs('https://638183.freep.cn/638183/svgdr/svgdr.min.js?v0', tzRun);
});

function tzRun(){
var aud = new AudPlayer(options);
var dr=_dr(msvg);
dr.ellipse(0,20,120,30,'rgba(0,100,100,.25)').addTo(g1).rotates(9);
var el = document.getElementById('lrc');
var bg = document.getElementById('bg');
var curIdx = -1;
var rafId = null;
function syncAll(){
    bg.src = aud.aud.paused
      ? 'https://wj.zp68.com/lxx/yunhua/2026/05/30/1F.jpg'
      : 'https://wj.zp68.com/lxx/yunhua/2026/05/30/1F.gif';
}
aud.aud.addEventListener('play', syncAll);
aud.aud.addEventListener('pause', syncAll);
aud.aud.addEventListener('ended', syncAll);
function renderMask(){
    var t = aud.aud.currentTime;
    var i = curIdx;

    if(i<0 || t<lines.t || t>=lines.tEnd){
      for(i=lines.length-1;i>=0;i--){
      if(t>=lines.t){ break; }
      }
      if(i!==curIdx && i>=0){
      el.textContent = lines.txt;
      curIdx = i;
      }
      if(i<0){
      el.style.webkitMaskImage =
      el.style.maskImage =
          'linear-gradient(to right,#000 0%,#000 0%,transparent 0%)';
      curIdx=-1;
      }
    }

    if(curIdx>=0){
      var seg = lines;
      var dur = Math.max(seg.tEnd - seg.t, 0.01);
      var p   = Math.min(Math.max((t - seg.t)/dur, 0), 1);
      var percent = (p*100).toFixed(2)+'%';

      el.style.webkitMaskImage =
      el.style.maskImage =
      'linear-gradient(to right,#000 0%,#000 '+percent+',transparent '+percent+')';
    }
    rafId = requestAnimationFrame(renderMask);
}
aud.aud.addEventListener('play', ()=>{ if(!rafId) rafId=requestAnimationFrame(renderMask); });
aud.aud.addEventListener('pause', ()=>{ cancelAnimationFrame(rafId); rafId=null; });
aud.aud.addEventListener('ended', ()=>{
    el.style.webkitMaskImage =
    el.style.maskImage =
      'linear-gradient(to right,#000 0%,#000 0%,transparent 0%)';
});

rafId = requestAnimationFrame(renderMask);
}

function loadJs(u,cb){
var s=document.createElement('script'); s.src=u; s.onload=cb; document.head.appendChild(s);
}
</script>

klxf 发表于 2026-5-31 23:52:33

漂亮~谢谢精彩分享

醉美水芙蓉 发表于 2026-6-1 07:11:25

klxf 发表于 2026-5-31 23:52
漂亮~谢谢精彩分享

谢谢友友支持！

月明工作室 发表于 2026-6-1 09:16:50

谢谢芙蓉老师精彩分享！

醉美水芙蓉 发表于 2026-6-1 17:38:37

月明工作室 发表于 2026-6-1 09:16
谢谢芙蓉老师精彩分享！

谢谢明月视听老师光临！
页: [1]
查看完整版本: 我想你的眼里只有我