本帖最后由 花简静 于 2025-2-27 20:50 编辑
<style>
@import 'https://638183.freep.cn/638183/web/css/audlrc.css';
#mama { margin: 130px 0 30px calc(50% - 931px);width: 1700px;height: 900px; background: black url('https://642303.freep.cn/642303/tu/20250220naihe01.webp') no-repeat center/ cover; overflow: hidden;}
#player { width: 40px;height: 40px;left: calc(60% - 350px); top: calc(46% - 70px); filter: hue-rotate(170deg); opacity: .66; }
#player:hover { filter: hue-rotate(30deg); transition: .7s; }
#prog { bottom: 20px; width: 220px; --bg1: #ffffffaa; --bg2: DimGray; --color: snow;opacity: .56; }
#lrc {left: 50%;transform: translateX(-50%);bottom: 30px; --bg: linear-gradient(#ffffffaa, #5b6167); color: DimGray;font: bold 1.6em cursive;opacity: .36; }
#vid { position: absolute; width: 100%; height: 110%; object-fit: cover; top:-80px; mix-blend-mode: screen; -webkit-mask: linear-gradient(to top, red 30%, transparent 55%, transparent);pointer-events: none; opacity: .29;}
</style>
<div id="mama" class="pa">
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2067118838.mp3"></audio>
<video id="vid" src="https://bpic.588ku.com/video_listen/588ku_preview/21/11/17/14/12/17/video61949d4198d9e.mp4" autoplay loop muted></video>
<div id="lrc" class="lrc" data-lrc="HCPlayer">HCPlayer</div>
<img id="player" class="player" src="https://pic.imgdb.cn/item/65c0a8f19f345e8d03032e45.png" alt="" />
<div id="prog" class="prog" data-tt="00:00 00:00"></div>
</div>
<script type="module">
import { Aud } from 'https://638183.freep.cn/638183/web/mod/audlrc.js';
var geci = [
[0.71,"单曲：奈何",1.4],
[2.15,"电视剧《玉骨遥》片尾曲",1.5],
[3.63,"歌手：em",1.4],
[5.07,"所属专辑：玉骨遥 影视原声专辑",1.8],
[6.88,"作词 : 小柯",1.2],
[8.11,"作曲 : 小柯",1.4],
[9.47,"编曲 : 小柯",1.1],
[10.58,"",1.5],
[12.05,"奈何你我遇见",3.4],
[16.89,"奈何此为命劫",3.3],
[21.02,"奈何琉璃花与雪寒薇",4.1],
[26.04,"爱与恨不分青白",3.7],
[32.02,"奈何一语成谶",2.8],
[36.03,"奈何缘起缘灭",4.0],
[41.71,"奈何一饮一啄不亏不欠",3.2],
[45.6,"玉骨刺眉泪潸然",3.5],
[52.08,"你心头的那滴血",3.1],
[56.45,"已风干成锁我的环",2.5],
[61.57,"锁住我千万里的行踪",3.9],
[66.78,"不离你身边",2.3],
[71.61,"你心头的那滴血",3.6],
[76.02,"已风干成锁我的环",2.9],
[81.03,"肝肠可以寸寸断",4.2],
[86.55,"你我目光总相连",3.3],
[89.85,"千山论坛 h ttp://qslt.net",4.5],
[94.81,"2025元月音画版同图活动制作",4.0],
[99.02,"奈何一语成谶",3.3],
[104.07,"奈何缘起缘灭",3.4],
[109.27,"奈何一饮一啄不亏不欠",3.1],
[113.04,"玉骨刺眉泪潸然",3.6],
[119.05,"你心头的那滴血",3.6],
[123.98,"已风干成锁我的环",2.5],
[129.06,"锁住我千万里的行踪",3.5],
[134.26,"不离你身边",2.9],
[139.09,"你心头的那滴血",3.6],
[144.05,"已风干成锁我的环",2.5],
[149.07,"肝肠可以寸寸断",3.7],
[154.13,"你我目光总相连",2.9],
[159.02,"你心头的那滴血",3.6],
[164.05,"已风干成锁我的环",2.7],
[169.01,"锁住我千万里的行踪",3.9],
[174.25,"不离你身边",2.2],
[179.13,"你心头的那滴血",3.6],
[184.04,"已风干成锁我的环",2.5],
[189.03,"肝肠可以寸寸断",3.6],
[194.13,"你我目光总相连",2.9],
[199.38,"奈何你我遇见",3.1],
[204.02,"奈何此为命劫",3.9]
];
var mDatas = { pa: mama, btn: player, prog: prog, lrc: lrc, lrcAr: geci };
var audio = new Aud(mDatas);
audio.play();
</script>
|
川公网安备51180202512072 )
