花甲走四方 发表于 2026-9-5 20:22

热血颂（王虹 徐良）

<style>
#mama { margin: 30px 0 30px calc(50% - 721px); width: 1280px; height: 702px; background: url('https://picasa.eu.org/i/2026/07/29/lrus9y.jpg') no-repeat center/cover; box-shadow: 0 0 8px rgba(0,0,0,.65); overflow: hidden; z-index: 1; position: relative; }
#mama > video { position: absolute; width: 100%; height: 30%; object-fit: cover; mix-blend-mode: screen; -webkit-mask: linear-gradient(red, transparent); pointer-events: none; }
.player { position: absolute; top: 10px; width: 120px; height: 120px; animation: rot 8s linear infinite var(--state); cursor: pointer; }
.player:nth-of-type(1) { left: 10%; }
.player:nth-of-type(2) { right: 10%; }
@keyframes rot { to { transform: rotate(360deg); } }
</style>

<div id="mama" class="mama">
      <audio src="https://imgimg.qqdsw8.cn/view.php/48c144d7856616321e6bde18349da4f4.mp3" autoplay loop></audio>
      <video src="https://img2.tukuppt.com/video_show/2269348/00/02/39/5b5dd5c5533bc.mp4" autoplay loop muted></video>
                <video src="https://img2.tukuppt.com/video_show/14331404/00/19/97/5f19574c220de.mp4" autoplay loop muted></video>
                              <video src="https://img2.tukuppt.com/video_show/2475824/00/02/15/5b542e5aa91c3.mp4" autoplay loop muted></video>
      <img class="player" src="https://picasa.eu.org/i/2026/07/29/m7ogf8.gif" alt="" />
      <img class="player" src="https://picasa.eu.org/i/2026/07/29/m7ogf8.gif" alt="" />
</div>

<script>
var sf = document.createElement('script');
sf.charset = 'utf-8';
sf.src = 'https://638183.freep.cn/638183/web/js2024/yslrc_133703119608822812.js';
document.body.appendChild(sf);

sf.onload = () => {
      HCPlayer({
                papa: '#mama',
                geci: geci,
                skip: 0,
                average: 0,
                btnplay: '.player',
                lrc_css: 'left: 50%; top: 520px; transform: translateX(-50%);',
                fs_css: 'left: 50%; bottom: 20px; transform: translateX(-50%); --bg: transparent; --color: #eee',
      });
};

var geci = `熱血頌 - 王虹、徐良
詞：陳哲
曲：蘇越
當你離開生長的地方夢中回望
可曾夢見河邊那棵亭亭的白楊
每一棵寸草都忘不了你日夜守望
思念你的何止是那親爹親娘
當你握別溫暖的手淚落幾行
可曾感到背影凝聚著滾燙的目光
每一棵赤盏男撵\`都深深理解你
每一個熱切的向往都充滿你的力量
你奔向遠方 帶著親人的希望
你奔向遠方 帶著火熱的衷腸
你奔向遠方 帶著親人的希望
你奔向遠方 帶著火熱的衷腸
最艱苦的地方
總有著戰士的剛強
勇士的肩頭肩負著多少人心頭的崇仰
誰不知生命的可貴
誰沒有幸福渴望
你默默無聞的足跡寫下不朽篇章
最艱苦的地方
總有著戰士的剛強
勇士的肩頭肩負著多少人心頭的崇仰
誰不知生命的可貴
誰沒有幸福渴望
你默默無聞的足跡寫下不朽篇章
你和我們同在 把美好未來開創
你是國魂軍魂
你是中華的鐵骨脊梁
你和我們同在 把美好未來開創
你是國魂軍魂
你是中華的鐵骨脊梁鐵骨脊梁
庆祝8.1建军节99周年
感谢欣赏聆听`;
</script>

花甲走四方 发表于 2026-9-5 20:32

@马黑黑 老师给看看为何歌词显示不出来？

红影 发表于 2026-9-6 07:03

制作很赞，欣赏高老师好帖{:4_199:}

马黑黑 发表于 2026-9-14 19:51

花甲走四方 发表于 2026-9-5 20:32
@马黑黑 老师给看看为何歌词显示不出来？

抱歉，才上来。这是歌词变量中的反引号 ` 里又有反引号造成的：

var geci = `熱血頌 - 王虹、徐良
詞：陳哲
每一棵赤盏男撵\`都深深理解你
感谢欣赏聆听`;

蓝色反引号包裹全部歌词，歌词内又有反引号时，在反引号前加入 \ 即可

已经帮你做了编辑，如果还不能正常显示歌词，刷新一下即可。

花甲走四方 发表于 2026-9-14 19:56

马黑黑 发表于 2026-9-14 19:51
抱歉，才上来。这是歌词变量中的反引号 ` 里又有反引号造成的：

var geci = `熱血頌 - 王虹 ...

感谢老师指导和修正，歌词显示已经正常，感谢{:4_199:}

马黑黑 发表于 2026-9-14 20:07

花甲走四方 发表于 2026-9-14 19:56
感谢老师指导和修正，歌词显示已经正常，感谢

JS代码里引号嵌套是个麻烦事，此前我也没有仔细谈及，给您添麻烦了

花甲走四方 发表于 2026-9-14 20:08

马黑黑 发表于 2026-9-14 20:07
JS代码里引号嵌套是个麻烦事，此前我也没有仔细谈及，给您添麻烦了

不麻烦，这回知道了，感谢{:4_205:}

马黑黑 发表于 2026-9-14 20:10

花甲走四方 发表于 2026-9-14 20:08
不麻烦，这回知道了，感谢

{:5_108:}

小辣椒 发表于 2026-9-15 22:23

欣赏老师的精彩制作，背景和歌词同步制作，都非常到位{:4_199:}

小辣椒 发表于 2026-9-15 22:23

感谢老师分享{:4_187:}
页: [1]
查看完整版本: 热血颂（王虹 徐良）