如何制作html5音频播放器同步歌词

如何制作html5音频播放器同步歌词,第1张

html5 audio 和 vedio 播放器歌词插件, 直接解析歌词源文件,

只需导入js文件 , 加入几句 js 代码即可, 默认至此歌词拖拽 ,

默认提供两个解析器, 俩个时间匹配函数。

第一层 一个 div 控制整体 宽度高度

第二层 class 3 个 用来控制 段落之间的 间隔

前面的1.几 那个 可以单独设置一个 class 样式 单独出来 不要和 段落放在一起。

两边文字要平行 就可以用 浮动

用CSS控制吧 看看下面的代码 比较简陋还请包涵 这段代码执行下来就是你要的效果了

<html>

<head>

<title>haha</title>

<style>

ul{list-style:none}

.mune{border:1px solid #bulewidth="290px"}

.mune li{float:leftmargin:"3px"font-size:"12px"}

</style>

</head>

<body>

<ul class="mune">

<li>第一章 </li>

<li>第二张 </li>

<li>第三章 </li>

<li>第四张 </li>

<li>第五章 </li>

<li>第六章 </li>

<li>第一章 </li>

<li>第二张 </li>

<li>第三章 </li>

<li>第四张 </li>

<li>第五章 </li>

<li>第六章 </li>

</ul>

</body>

</html>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/8365762.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-15
下一篇 2023-04-15

发表评论

登录后才能评论

评论列表(0条)

保存