青花
<style>#mama {
margin: 130px 0 30px calc(50% - 721px);
width: 1280px;
height: 720px;
background: url('https://638183.freep.cn/638183/t24/webp2/qkhx.webp') 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: 100%;
object-fit: cover;
mix-blend-mode: screen;
-webkit-mask: linear-gradient(to right top, red 10%, transparent 90%, transparent);
pointer-events: none;
}
</style>
<div id="mama" class="mama">
<audio src="https://music.163.com/song/media/outer/url?id=2617423373" autoplay loop></audio>
<video src="https://img.tukuppt.com/video_show/2418175/00/02/06/5b503d6c75c2a.mp4" autoplay loop muted></video>
</div>
<script>
var sf = document.createElement('script');
sf.charset = 'utf-8';
sf.src = 'https://638183.freep.cn/638183/web/js2024/plater_yslrc.js';
document.body.appendChild(sf);
sf.onload = () => {
HCPlayer({
papa: '#mama',
geci: geci,
skip: 0,
average: 0,
player_css: 'left: 20px; bottom: 20px; --color2: #a0869a; --color1: #2953e1; --bg: repeating-radial-gradient(gray 0px, black 1px, #525e54 4px); --border: #212;',
lrc_css: 'right: 30px; top: 20px; --bg: linear-gradient(lightblue, teal); color: lightblue;',
fs_css: 'left: 20px; top: 20px; --bg: transparent; --color: #eee;',
});
};
var geci = `
恍恍惚惚已经隔世
青花
歌手：刘大拿
作词：陈信荣
作曲：周传雄
原唱：周传雄
三月走过柳絮散落恋人们匆匆
我的爱情闻风不动
…………
翻阅昨日仍有温度蒙尘的心事
恍恍惚惚已经隔世
…………
遗憾无法说
惊觉心一缩
紧紧握着青花信物信守着承诺
离别总在失意中度过
记忆油膏反复涂抹无法愈合的伤口
你的回头划伤了沉默
那夜重逢停止漂泊你曾回来过
相濡相忘都是疼痛
…………
只因昨日善良固执委屈着彼此
打碎信物取消来世
…………
遗憾无法说
惊觉心一缩
紧紧握着青花信物信守着承诺
离别总在失意中度过
记忆油膏反复涂抹无法愈合的伤口
你的回头划伤了沉默
紧紧握着青花信物雕刻着寂寞
就好像我无主的魂魄
纠缠过往无端神伤摔碎谁也带不走
你我一场唤不醒的梦
…………
…………
2024-8-26
`;
</script>
<h2>帖子代码</h2>
<div class="hE"><pre>
<style>
#mama {
margin: 130px 0 30px calc(50% - 721px);
width: 1280px;
height: 720px;
background: url('https://638183.freep.cn/638183/t24/webp2/qkhx.webp') 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: 100%;
object-fit: cover;
mix-blend-mode: screen;
-webkit-mask: linear-gradient(to right top, red 10%, transparent 90%, transparent);
pointer-events: none;
}
</style>
<div id="mama" class="mama">
<audio src="https://music.163.com/song/media/outer/url?id=2617423373" autoplay loop></audio>
<video src="https://img.tukuppt.com/video_show/2418175/00/02/06/5b503d6c75c2a.mp4" autoplay loop muted></video>
</div>
<script>
var sf = document.createElement('script');
sf.charset = 'utf-8';
sf.src = 'https://638183.freep.cn/638183/web/js2024/plater_yslrc.js';
document.body.appendChild(sf);
sf.onload = () => {
HCPlayer({
papa: '#mama',
geci: geci,
skip: 0,
average: 0,
player_css: 'left: 20px; bottom: 20px; --color2: #a0869a; --color1: #2953e1; --bg: repeating-radial-gradient(gray 0px, black 1px, #525e54 4px); --border: #212;',
lrc_css: 'right: 30px; top: 20px; --bg: linear-gradient(lightblue, teal); color: lightblue;',
fs_css: 'left: 20px; top: 20px; --bg: transparent; --color: #eee;',
});
};
var geci = `
恍恍惚惚已经隔世
青花
歌手：刘大拿
作词：陈信荣
作曲：周传雄
原唱：周传雄
三月走过柳絮散落恋人们匆匆
我的爱情闻风不动
…………
翻阅昨日仍有温度蒙尘的心事
恍恍惚惚已经隔世
…………
遗憾无法说
惊觉心一缩
紧紧握着青花信物信守着承诺
离别总在失意中度过
记忆油膏反复涂抹无法愈合的伤口
你的回头划伤了沉默
那夜重逢停止漂泊你曾回来过
相濡相忘都是疼痛
…………
只因昨日善良固执委屈着彼此
打碎信物取消来世
…………
遗憾无法说
惊觉心一缩
紧紧握着青花信物信守着承诺
离别总在失意中度过
记忆油膏反复涂抹无法愈合的伤口
你的回头划伤了沉默
紧紧握着青花信物雕刻着寂寞
就好像我无主的魂魄
纠缠过往无端神伤摔碎谁也带不走
你我一场唤不醒的梦
…………
…………
2024-8-26
`;
</script>
</pre></div>
<script>
var sc = document.createElement('script');
sc.chartset = 'utf-8';
sc.src = 'https://638183.freep.cn/638183/web/js2024/helight.js';
document.body.appendChild(sc);
</script>
原生LRC歌词同步之老唱机封装，插件说明：原生lrc歌词同步之老唱机播放器 (52qingyin.cn) 好听 好看~~{:4_204:}{:4_190:} 在某些论坛测试有封装代码的帖子视频特效都不显现不知何故。 朵拉 发表于 2024-8-27 10:03
好听 好看~~
{:4_190:} 起个网名好难 发表于 2024-8-27 10:55
在某些论坛测试有封装代码的帖子视频特效都不显现不知何故。
这类现象比较怪异，不好理解。
封装仅对视频的播放与暂停进行与音频同步的管理，视频代码是在帖子里。可以单独测试视频，若能正常播放，加入帖子CSS代码看看是否还正常。 本帖最后由 起个网名好难 于 2024-8-27 13:42 编辑
马黑黑 发表于 2024-8-27 13:06
这类现象比较怪异，不好理解。
封装仅对视频的播放与暂停进行与音频同步的管理，视频代码是在帖子里。 ...
把封装的代码展开了问题仍然存在，问题好像就出在对视频的操作上
而且奇怪的是停止播放没错，启动就不行了
http://keai99.top/thread-596231-1-1.html vs https://www.huachaowang.com/forum.php?mod=viewthread&tid=77767
谢谢老师辛苦，问好！ 梦江南 发表于 2024-8-27 15:43
谢谢老师辛苦，问好！
{:4_190:} 起个网名好难 发表于 2024-8-27 13:37
把封装的代码展开了问题仍然存在，问题好像就出在对视频的操作上
视频元素失去 src ，道理上不应该如此。如果不适用插件呢？JS能不能操作视频？ 马黑黑 发表于 2024-8-27 17:56
视频元素失去 src ，道理上不应该如此。如果不适用插件呢？JS能不能操作视频？
展开代码也一样，应该是与所处的网站有关 起个网名好难 发表于 2024-8-27 13:37
把封装的代码展开了问题仍然存在，问题好像就出在对视频的操作上
原来梦江南是那里的静悟{:4_173:} 果然是老唱片效果的封装，这个好看。黑黑辛苦了{:4_199:} 画面非常奇特，这《青花》里的人物真美，还带了点妖气呢。{:4_173:} 整体设计那么奇妙，很赞{:4_199:} 红影 发表于 2024-8-27 19:21
整体设计那么奇妙，很赞
谢赞 红影 发表于 2024-8-27 19:03
画面非常奇特，这《青花》里的人物真美，还带了点妖气呢。
妖女 红影 发表于 2024-8-27 19:01
果然是老唱片效果的封装，这个好看。黑黑辛苦了
默认的也不错的 起个网名好难 发表于 2024-8-27 18:06
展开代码也一样，应该是与所处的网站有关
坏境问题，JS自身只有规避。