论坛 › 人机音画视频 › 龚爽虽逝 歌声永存

万顷湖 发表于 2026-9-4 20:50

龚爽虽逝 歌声永存

<table cellspacing="0" cellpadding="0"><tr><td class="t_f" id="postmessage_497175">
<div style="position: absolute; left:0px;width:100%;margin-top:120px;">

<style>
#papa { margin: width: 1186px;height: 620px;background: url(https://free.picui.cn/free/6377/2026/09/04/6a9a92bdd91f6.jpg) no-repeat center/cover; box-shadow: 2px 2px 8px #000; overflow: hidden; z-index: 1; position: relative;}
.inmg{width:100%; height: 620px; position:absolute; TOP:0%;LEFT: 0%;}
.start{color: #fff;position: absolute; top:84%; left: 22%;}
.end{color: #fff;position: absolute;top:84%; left: 33%;}
#btn{background: url(https://free.picui.cn/free/2026/07/30/6a6b56d183904.png) no-repeat 0px 0px/cover;width:80px;height: 80px;left: 27%; top: 82%;position: absolute;z-index: 20;}

.lrc { z-index: 21; position: absolute; top: 20%; left: 41%; width: 740px; height: 350px; overflow: hidden; }
.lrc #ul { width: 100%; padding: 0; list-style: none; transition: 0.3s all ease; margin: 0; }
.lrc #ul li { color: #fff; font: 300 20px 'YouYuan', sans-serif; transition: .3s all ease; list-style-type: none; text-align: center; display: block; padding: 0 10px; height: 50px; line-height: 50px; margin: 0 auto; cursor: pointer; }
.lrc #ul li.active { transform: scale(1.2); color: #00FFaa; font-weight: 650; }
</style>
<div id="papa">



<div>
<marquee id="m" behavior="alternate" scrollamount="5" height=620>

<img alt="" src="https://free.picui.cn/free/6377/2026/09/04/6a9a92f8db4d5.jpg" title="" style="width: 1186px;height: 620px;" />
<img alt="" src="https://free.picui.cn/free/6377/2026/09/04/6a9a937393f59.jpg" title="" style="width: 1186px;height: 620px;" />

<img alt="" src="https://free.picui.cn/free/6377/2026/09/04/6a9a9390b5a6c.jpg" title="" style="width: 1186px;height: 620px;" />
<img alt="" src="https://free.picui.cn/free/6377/2026/09/04/6a9a92bdd91f6.jpg" title="" style="width: 1186px;height: 620px;" />

<img alt="" src="https://cloud.firgt.cn/down.php/bae93bc031ff3319e0fc158e22668d32.jpg" title="" style="width: 1186px;height: 620px;"/>
<img alt="" src="https://cloud.firgt.cn/down.php/23e223d25568efa8e29e7ba7f2261af7.jpg" title=""style=" width: 1186px;height: 620px;"/>

<img alt="" src=“https://cloud.firgt.cn/down.php/aacff0ffb5a8120d885a756c23425d12.jpg” title=""style="width: 1186px;height: 620px;" />
<img alt="" src="https://free.picui.cn/free/6377/2026/09/04/6a9a934a5e479.jpg" title=""style="width: 1186px;height: 620px;" />

</marquee>
</div>

<span class="start">00:00</span><p id="btn"></p><span class="end">00:00</span>
<div class="lrc">
<ul id="ul"></ul>
</div>

</div>
<audio id="aud" src="https://www.joy127.com/url/158842.mp3" autoplay loop ></audio>

<script>
var music = document.getElementById('aud');
var m= document.getElementById('m');
var m4 = document.getElementById('m4');var m1 = document.getElementById('m1');var m2 = document.getElementById('m2');var m3 = document.getElementById('m3');
var btn = document.getElementById('btn');
btn.onclick = function() {
if (aud.paused) {
aud.play();
m.start();m4.start();m1.start();m2.start();m3.start();
btn.style.background = 'url(https://free.picui.cn/free/2026/07/30/6a6b53fca3e16.png) no-repeat 0px 0px/cover';
} else {

aud.pause();m.stop();m4.stop();m1.stop();m2.stop();m3.stop();
btn.style.background = 'url(https://free.picui.cn/free/2026/07/30/6a6b53fca3e16.png) no-repeat 0px 0px/cover';
}
};
const start = document.querySelector('.start')
const end= document.querySelector('.end')
function conversion (value) {
let minute = Math.floor(value / 60)
minute = minute.toString().length === 1 ? ('0' + minute) : minute
let second = Math.round(value % 60)
second = second.toString().length === 1 ? ('0' + second) : second
return `${minute}:${second}`
}

aud.onloadedmetadata = function () {
end.innerHTML = conversion(aud.duration)
start.innerHTML = conversion(aud.currentTime)
}
setInterval(() => {
start.innerHTML = conversion(aud.currentTime)

}, 1000)

</script>

<script>
let lrc = `幸福的道路越走越宽广 - 龚爽
词：杨荣明
曲：桑楠
天安门国旗飘扬
迎来了新时代和煦的阳光
春风浩荡丝路飘香
东方的巨轮再次扬帆起航
新目标 新征程
甜蜜的日子越过越舒畅
心连心跟着党
人民幸福和谐安康
中南海明灯闪亮
照亮了中国梦前进的方向
不忘初心 牢记使命
满怀豪情续写美丽新篇章
新蓝图 新思想
幸福的道路越走越宽广
心连心跟着党
中华复兴国家富强
新蓝图 新思想
幸福的道路越走越宽广
心连心跟着党
中华复兴国家富强
中华复兴国家繁荣富强

`;
let lrcArr = lrc.split('\n');
let result = [];
var audio = document.querySelector("#aud");
var ul = document.querySelector("#ul");
var container = document.querySelector(".lrc");

for (let i = 0; i < lrcArr.length; i++) {
var lrcData = lrcArr.split(']');
if (lrcData.length < 2) continue;
var lrcTime = lrcData.substring(1);
var obj = {
time: parseTime(lrcTime),
word: lrcData.trim()
}
result.push(obj);
}

function parseTime(lrcTime) {
let lrcTimeArr = lrcTime.split(":");
return +lrcTimeArr * 60 + parseFloat(lrcTimeArr);
}

function getIndex() {
let time = audio.currentTime;
for (let i = 0; i < result.length; i++) {
if (result.time > time) {
return i - 1;
}
}
return result.length - 1;
}

function createElements() {
let fragment = document.createDocumentFragment();

for (let i = 0; i < result.length; i++) {
let li = document.createElement("li");
li.innerText = result.word;

li.addEventListener("click", function () {
audio.currentTime = result.time;
setOffset();
});

fragment.appendChild(li);
}

ul.appendChild(fragment);
}

createElements();
let containerHeight = container.clientHeight;
let liHeight = ul.children?.clientHeight || 50;
let minOffset = 0;
let maxOffset = ul.clientHeight - containerHeight;

function setOffset() {
const index = getIndex();
if (index < 0) return;

const liHeight = ul.children?.clientHeight || 50;
let offset = liHeight * index - containerHeight / 2 + liHeight / 2;

offset = Math.max(minOffset, Math.min(offset, maxOffset));

ul.style.transform = `translateY(${-offset}px)`;

ul.querySelectorAll('.active').forEach(li => li.classList.remove('active'));
if (index < ul.children.length) {
ul.children.classList.add('active');
}
}

audio.addEventListener("timeupdate", setOffset);
</script>
</div>
<div style="height:960px;"></div>
</td></tr></table>

红影 发表于 2026-9-4 21:14

这么年轻的艺术家，离去很可惜。
欣赏万顷湖老师好帖，共同悼念女高音歌唱家龚爽{:5_161:}

杨帆 发表于 2026-9-4 21:57

好帖子，有深意，谢谢万顷湖老师分享{:4_190:}

杨帆 发表于 2026-9-4 22:55

龚爽，韶华虽逝，余音长存，愿歌声永留人间，一路走好。

万顷湖 发表于 2026-9-5 09:20

红影 发表于 2026-9-4 21:14
这么年轻的艺术家，离去很可惜。
欣赏万顷湖老师好帖，共同悼念女高音歌唱家龚爽

阴阳两隔本有序，无奈阎王瞎点名。谢谢关注，谢谢鼓励。

万顷湖 发表于 2026-9-5 09:21

杨帆 发表于 2026-9-4 22:55
龚爽，韶华虽逝，余音长存，愿歌声永留人间，一路走好。

阴阳两隔本有序，无奈阎王瞎点名。谢谢关注，谢谢鼓励。

玫瑰 发表于 2026-9-7 09:40

已看，已阅，已想，已听

万顷湖 发表于 2026-9-7 16:44

谢谢关注，谢谢留言。班门弄斧，立正，敬礼！

深秋红枫 发表于 2026-9-7 21:04

谢谢万老分享好贴。
龚爽虽英年早逝，但其歌声永留人间！

查看完整版本: 龚爽虽逝 歌声永存