Rise Above（单曲v1示范）

马黑黑

马黑黑

全帖代码

1. <style>
   
2.         @import 'https://638183.freep.cn/638183/web/mod/mp3player_lrc_v1.css';
   
3.         #tz { margin: 30px 0 30px calc(50% - 583px); background: url('https://638183.freep.cn/638183/t24/webp3/underground.webp') no-repeat center/cover; }
   
4.         #mplayer { width: 600px; bottom: 10px; background: none; box-shadow: none; color: snow; }
   
5.         #mplayer img { filter: invert(.8); }
   
6.         #fsbtn { bottom: 60px; border-color: snow; color: snow; }
   
7. </style>
   
8. 
   
9. <div id="tz" class="pa">
   
10.         <audio src="https://music.163.com/song/media/outer/url?id=34749557"></audio>
    
11.         <video class="vid" src="https://bpic.588ku.com/video_listen/588ku_video/22/11/03/13/50/12/video6363569454a33.mp4" autoplay loop muted></video>
    
12. </div>
    
13. 
    
14. <script type="module">
    
15.         import { hcplay } from 'https://638183.freep.cn/638183/web/mod/mp3player_lrc_v1.js';
    
16.         hcplay(tz);
    
17. </script>

复制代码

马黑黑

模块使用说明：mp3player单曲js模块v1文档 - 马黑黑教程专版 - 花潮论坛 - Powered by Discuz!

梦江南

谢谢黑黑老师，学习了。

马黑黑

梦江南 发表于 2025-2-25 13:48
谢谢黑黑老师，学习了。

花飞飞

这个看上去只有一丢丢代码。。。
配合使用说明。可以无限可能。。
白老师作品就这么体贴。

花飞飞

这个小播用了之前的细线条小播，无边框设计更漂亮啊。。。
难道也可以延续之前那些频谱之前的进度条。。。
哈哈。。我天马行空想得多了。

花飞飞

音量显示做了调整，这次是竖版，更清楚了。。
这个更改要加分。。

花飞飞

音乐好听，全屏更加震撼。。完美。。。

红影

跟着链接，以为跑到黑黑网站呢，结果跑这里来了。
首先看到音量调整变成竖直的，这样好，不影响时间数值的展示了

红影

索性现在这个里面回了，这个也漂亮，播放器在需要的时候才被召唤出来，而且纯净的样子也不错，没有了框的显示也觉得清爽呢

小辣椒

黑黑这个单曲播放器还加了音量的设置

红影

很玄妙的场景，这个制作很漂亮

小辣椒

这个单曲播放器也是好玩的，最近黑黑播放器教程出的多起来了

马黑黑

小辣椒 发表于 2025-2-25 20:15
这个单曲播放器也是好玩的，最近黑黑播放器教程出的多起来了

没有的，就是这两个，鼓捣来鼓捣去

朵拉

漂亮，欣赏学习了

马黑黑

朵拉 发表于 2025-2-25 20:59
漂亮，欣赏学习了

感谢支持