小辣椒 发表于 2024-9-23 12:18

负心的你--歌手:云南三怪

<style>
#papa { left: -220px; width: 1280px; height: 710px; top: 150px; display: grid; place-items: center; background: teal url('https://pic.imgdb.cn/item/6305bdfc16f2c2beb163da86.jpg') no-repeat center/cover; box-shadow: 3px 3px 20px #000; position: relative; z-index: 3; }
#canv { position: absolute; bottom: 30px; cursor: pointer; box-reflect: below 0 linear-gradient(transparent, transparent 50%, rgba(255,255,255,.3)); -webkit-box-reflect: below 0 linear-gradient(transparent, transparent 50%, rgba(255,255,255,.3)); }
#lrcbox { position: absolute; left: 500px; top: 280px; font: bold 30px / 40px sans-serif; color: MintCream; text-shadow: 1px 1px 2px #000, 10px 10px 10px rgba(0, 0, 0, .35); user-select: none; }
</style>

<div id="papa">
      <canvas id="canv"></canvas>
      <span id="lrcbox">小辣椒音乐欣赏</span>
</div>

<script>
let ctx = canv.getContext('2d'),
      w = canv.width =750,
      h = canv.height = 60,
      lines = [],
      total = 80,
      lineWidth = (w - 2 * total) / total,
      aud = new Audio();
let lrcAr = [
                ['0.00','负心的你--歌手:云南三怪'],
        ['9.95','帖赠:恋恋风尘'],
        ['17.50','驻立在船头'],
        ['19.73','想挥挥我的手'],
        ['22.75','奈何气笛催你走'],
        ['28.51','冰冷的风雨是阵阵吹起'],
        ['34.21','随着那波涛声'],
        ['36.96','无情地落下去'],
        ['40.10','紧闭的双眼中'],
        ['43.14','想着你的情'],
        ['46.06','虽然你离去'],
        ['48.83','永远难忘记'],
        ['51.57','冰冷的风雨刺中我的心'],
        ['57.37','哎哟你呀你没良心'],
        ['63.45','汽笛声渐渐走'],
        ['65.94','我心也被带走'],
        ['68.78','风雨依然滴滴落'],
        ['73.30','看着你的背影消逝无踪'],
        ['80.70','喊也喊不停'],
        ['83.39','叫也叫不醒'],
        ['86.74','LRC编辑:宁静'],
        ['104.38','驻立在船头'],
        ['106.60','想挥挥我的手'],
        ['109.50','奈何气笛催你走'],
        ['115.38','冰冷的风雨是阵阵吹起'],
        ['121.04','随着那波涛声'],
        ['123.83','无情地落下去'],
        ['126.88','紧闭的双眼中'],
        ['130.06','想着你的情'],
        ['132.60','虽然你离去'],
        ['135.68','永远难忘记'],
        ['138.32','冰冷的风雨刺中我的心'],
        ['144.15','哎哟你呀你没良心'],
        ['150.21','汽笛声渐渐走'],
        ['152.77','我心也被带走'],
        ['155.64','风雨依然滴滴落'],
        ['161.18','看着你的背影消逝无踪'],
        ['167.26','喊也喊不停'],
        ['170.15','叫也叫不醒'],
        ['173.78','谢谢欣赏!'],
        ['182.64','谢谢欣赏!']
];
aud.src = 'https://file.uhsea.com/2410/75915a7a55af65bf97c6f3b0235650dbFG.m4a';
aud.loop = true;
aud.autoplay = true;

aud.addEventListener('timeupdate', () => {
      change();
      for(j=0; j<lrcAr.length; j++){
                if(aud.currentTime >= lrcAr) lrcbox.innerHTML = lrcAr;
      }
});

canv.onclick = () => aud.paused ? aud.play() : aud.pause();

function Line(x1,y1,x2,y2) {
      this.x1 = x1;
      this.y1 = y1;
      this.x2 = x2;
      this.y2 = y2;
      lines.push(this);
}

Line.prototype.draw = function() {
      ctx.beginPath();
      ctx.strokeStyle = this.color;
      ctx.lineWidth = lineWidth;
      ctx.moveTo(this.x1, this.y1);
      ctx.lineTo(this.x2,this.y2);
      ctx.stroke();
}

for(let j = 0; j < total; j ++) {
      let line = new Line();
      line.x1 = j * lineWidth + j*2 + lineWidth / 2 + 1;
      line.y1 = h;
      line.x2 = line.x1;
      line.y2 = 60;
      line.color = 'purple';
      line.draw();
}

function change() {
      ctx.clearRect(0,0,w,h);
      for(let item of lines) {
                item.color = '#' + Math.random().toString(16).substr(-6);
                item.y2 = h - (Math.random() * h);
                item.draw();
      }
}
change();
</script>
<br><br><br><br><br><br><br><br><br><br>

小辣椒 发表于 2024-9-23 12:21

{:6_181:}{:6_181:}{:6_181:}

2年前发的,那边修复了

liumang 发表于 2024-9-23 20:43

小辣椒 发表于 2024-9-23 12:21
2年前发的,那边修复了

这么久之前的帖还修复啊:lol

liumang 发表于 2024-9-23 20:44

歌词有点沧桑感

liumang 发表于 2024-9-23 20:45

很难得现在可以听到这种歌曲了{:5_150:}{:5_150:}{:5_150:}

小辣椒 发表于 2024-9-23 22:40

liumang 发表于 2024-9-23 20:45
很难得现在可以听到这种歌曲了

我也是感觉这种歌曲很少的,就修复了

小辣椒 发表于 2024-9-23 22:41

liumang 发表于 2024-9-23 20:43
这么久之前的帖还修复啊

是的,感觉这歌有特色,某人说这个是越南歌曲

liumang 发表于 2024-9-28 09:36

小辣椒 发表于 2024-9-23 22:41
是的,感觉这歌有特色,某人说这个是越南歌曲

第一次听这首歌{:5_150:}{:5_150:}

liumang 发表于 2024-9-28 09:37

小辣椒 发表于 2024-9-23 22:40
我也是感觉这种歌曲很少的,就修复了

小辣椒辛苦了{:5_122:}

老谟深虑 发表于 2024-9-30 08:27

            欣赏精美音画,上午好!
页: [1]
查看完整版本: 负心的你--歌手:云南三怪