|
|

楼主 |
发表于 2025-10-19 09:56
|
显示全部楼层
本帖最后由 马黑黑 于 2025-10-19 10:03 编辑
参考代码
- <style>
- @import 'https://638183.freep.cn/638183/web/tz/tz.e.trial.css';
- .pa { --offsetX: 81px; --ma-size: 160px; --bg: url('https://638183.freep.cn/638183/t24/w6/1019.webp') no-repeat center/cover; }
- </style>
- <div class="pa"></div>
- <script type="module">
- import TZ from 'https://638183.freep.cn/638183/web/tz/tz.e.trial.js';
- const tz = TZ.TZ('pa'); // 创建帖笔
- // 花潮LRC歌词(有多少就创建多少)
- let gc1 = [[2,"...",8],[18.41,"...",4.6],[183.33,"...",9.7]];
- let gc2 = [[1.16,"...",7.2],[10.56,"...],[229.94,"...",6.2]];
- // 音乐清单(带歌词的加上LRC歌词数组变量)
- const musics = [
- ['https://music.163.com/song/media/outer/url?id=419827621', '亲爱的小孩', gc1],
- ['https://music.163.com/song/media/outer/url?id=419827618', '突然想起你'],
- ['https://music.163.com/song/media/outer/url?id=419827634', 'Lydia', gc2],
- ['https://music.163.com/song/media/outer/url?id=419827632', '嫉妒'],
- ['https://music.163.com/song/media/outer/url?id=1907246482', '今生h还在一起吗'],
- ['https://music.163.com/song/media/outer/url?id=1371760677', '人性']
- ];
- // 小播
- tz.add('img', '', 'ma', {
- src: 'https://638183.freep.cn/638183/small/webp/f02.webp',
- alt: '',
- title: 'Alt+X',
- style: 'bottom: 40px; border-radius: 50%;'
- }).playmp3();
- // 音乐列表
- tz.mlist(musics, 1, 'top: 20px;').style('left: 20px; bottom: 20px;');
- // 全屏
- tz.fs().style('right: 20px; bottom: 20px;');
- // 创建svg(进度器容器)
- tz.add('svg', 'msvg', '', {width: 200, height: 200, style: 'bottom: 20px;'});
- // 创建两个圆(进度器)
- tz.svgSon(msvg, 'circle', {
- id: 'track',
- cx: 100,
- cy: 100,
- r: 95,
- fill: 'transparent',
- stroke: 'lightblue',
- 'stroke-width': 8
- });
- tz.svgSon(msvg, 'circle', {
- id: 'prog',
- cx: 100,
- cy: 100,
- r: 95,
- fill: 'transparent',
- stroke: 'teal',
- 'stroke-width': 8
- });
- // 启用svg进度器(参数 : svg、底轨、进度轨)
- tz.svgprog(msvg, track, prog);
- </script>
复制代码 (说明:歌词和歌单代码这里简化,提供的是结构性创建方法)
|
评分
-
| 参与人数 1 | 威望 +50 |
金钱 +100 |
经验 +50 |
收起
理由
|
红影
| + 50 |
+ 100 |
+ 50 |
赞一个! |
查看全部评分
|