菩萨吟
<style>@import 'https://638183.freep.cn/638183/web/mod/anklet_lrc.css';
#pa { margin: 30px 0 30px calc(50% - 681px); width:1200px; height: 700px; background: url('https://638183.freep.cn/638183/t24/webp3/pusayb.webp') no-repeat center/cover; }
#mplayer { width: 200px; height: 200px; color: snow; bottom: 40px; --color1: white; --color2: gray; --prog: red; --track: white; --bRad: 50% 80%; --btnBg: url('https://638183.freep.cn/638183/t23/btn/meihua_133482968750383750.png') center/cover; }
#fsbtn { right: 200px; bottom: 20px; }
</style>
<div id="pa" class="pa">
<audio src="https://music.163.com/song/media/outer/url?id=2067797122"></audio>
<video class="vid" src="https://bpic.588ku.com/video_listen/588ku_video/22/11/05/08/05/36/video6365a8d06c60e.mp4" autoplay loop muted></video>
<div id="fsbtn" class="fsbtn"></div>
</div>
<script type="module">
import fscreen from 'https://638183.freep.cn/638183/web/mod/fscreen.js';
import { hcplay } from 'https://638183.freep.cn/638183/web/mod/anklet_lrc.js';
hcplay(pa);
fscreen.fs(pa, fsbtn);
</script> <h2>帖子代码</h2>
<div id="hEdiv"><pre id="hEpre">
<style>
@import 'https://638183.freep.cn/638183/web/mod/anklet_lrc.css';
#pa { margin: 30px 0 30px calc(50% - 681px); width:1200px; height: 700px; background: url('https://638183.freep.cn/638183/t24/webp3/pusayb.webp') no-repeat center/cover; }
#mplayer { width: 200px; height: 200px; color: snow; bottom: 40px; --color1: white; --color2: gray; --prog: red; --track: white; --bRad: 50% 80%; --btnBg: url('https://638183.freep.cn/638183/t23/btn/meihua_133482968750383750.png') center/cover; }
#fsbtn { right: 200px; bottom: 20px; }
</style>
<div id="pa" class="pa">
<audio src="https://music.163.com/song/media/outer/url?id=2067797122"></audio>
<video class="vid" src="https://bpic.588ku.com/video_listen/588ku_video/22/11/05/08/05/36/video6365a8d06c60e.mp4" autoplay loop muted></video>
<div id="fsbtn" class="fsbtn"></div>
</div>
<script type="module">
import fscreen from 'https://638183.freep.cn/638183/web/mod/fscreen.js';
import { hcplay } from 'https://638183.freep.cn/638183/web/mod/anklet_lrc.js';
hcplay(pa);
fscreen.fs(pa, fsbtn);
</script>
</pre></div>
<p><br>相关说明请查阅：<a href="/forum.php?mod=viewthread&tid=79806" target="_blank">脚镯播放器</a></p>
<script type="module">
import hlight from 'https://638183.freep.cn/638183/web/mod/helight.js';
hlight.hl(hEdiv, hEpre);
</script>
如果需要使用此模块发布花潮格式的LRC歌词同步帖子，可以参阅近期其他相关帖子，或等明天或后天俺再给个例子。下面简单说下LRC歌词同步帖的做法：
（一）css里有 #lrc 选择器，用以定位歌词位置、给歌词配色；
（二）HTML代码中有： <div id="lrc" class="lrc" data_lrc="HCPLayer">HCPlayer</div>
（三）JS代码中，① 声明歌词：var geci = [, , ];②指定歌词变量：hcplay(pa, geci); 脚镯圆圈的闪动正好和音乐相呼应，这个小播效果太适合这个帖子了{:4_199:} 视频也选得好，真的如观音大士普降甘霖一般，美好的护佑从上空洒向普罗大众{:4_187:} 一样很简洁的代码，还有详细解说，真好{:4_187:} 现在很需要菩萨保佑。高举拜香,虔诚地祈愿:“愿此香火,上达天听,下通神灵。弟子祈求灾厄已过，诸事顺利。同时愿为众生祈福,祈愿国泰民安,风调雨顺。”{:5_161:} 南无大慈大悲观世音菩萨{:5_161:} 南海观世音现身花潮，阿弥陀佛！{:4_199:} 红影 发表于 2024-12-2 15:30
南无大慈大悲观世音菩萨
红影童学你信她吗？{:4_189:} 热烈祝贺脚镯播放器终于发布了，谢谢马老师的精彩分享{:4_191:} 杨帆 发表于 2024-12-2 16:20
热烈祝贺脚镯播放器终于发布了，谢谢马老师的精彩分享
{:4_190:} 这个脚链小播见过几次，
这个阴影设置比较讲究，无论是什么颜色看珠子都跟玉质地一样好看。。
刚看了说明书，这两种颜色更改就可以调出与贴子一致的色彩来：--color1: white;--color2: gray; 花飞飞 发表于 2024-12-2 18:47
这个脚链小播见过几次，
这个阴影设置比较讲究，无论是什么颜色看珠子都跟玉质地一样好看。。
刚看了说明 ...
也可以使用随机色，就是不设置 --color1 和 --color2，也挺好看的 马黑黑 发表于 2024-12-2 13:30
如果需要使用此模块发布花潮格式的LRC歌词同步帖子，可以参阅近期其他相关帖子，或等明天或后天俺再给个例 ...
带歌词的三大部分都要配套跟上。
这个说明也细致。。
还是期待看到老师的示范贴。。。每次看都有创意和惊喜{:4_170:}
马黑黑 发表于 2024-12-2 18:49
也可以使用随机色，就是不设置 --color1 和 --color2，也挺好看的
有试着看了的 ，跟玻璃鹅卵石一样好看。。
最近的随机色柔和很多，也有处理一丢丢吧比如透明度 花飞飞 发表于 2024-12-2 18:54
有试着看了的 ，跟玻璃鹅卵石一样好看。。
最近的随机色柔和很多，也有处理一丢丢吧比如透明度
那不一定，不过也有点关系。比方内阴影，它就有一定的透明度 为啥不能是手链呢 岁月·如歌 发表于 2024-12-2 16:04
红影童学你信她吗？
我信奉和尊敬所有的神佛{:4_187:} 绿叶清舟 发表于 2024-12-2 20:29
为啥不能是手链呢
手链也可以，不过脚先戴过了，你不介意的话拿去当手链吧