序
目前MoePlayer/cPlayer 可以达到想要的效果。
做法
在需要的位置用
，然后其余都放在底部Script里。
DIV ID要和Script的element: document.getElementById(‘app’)中相互对应
代码语言：javascript复制<div id="app"></div>
### Script下 ###
<!-- 加载 cplayer 脚本 -->
<script src="https://cdn.jsdelivr.net/npm/cplayer/dist/cplayer.min.js"></script>
<script>
let player = new cplayer({
element: document.getElementById('app'),
playlist: [
{
src: '歌曲资源链接...',
poster: '封面链接...',
name: '歌曲名称...',
artist: '歌手名称...',
lyric: '歌词...', ##例如abc.lrc
sublyric: '副歌词，一般为翻译...'
},
##第二首歌
{
...
},
......
]
})
</script>完成
- 本文标题：如何给网页添加好看的HTML音乐播放器
- 本文作者：暗香疏影
- 创建时间：2020-04-23 00:00:00
- 本文链接：https://blog.withkr.xyz/2020/04/23/2020-04-23-Web-HTML-Music-Player/
- 版权声明：本博客所有文章除特别声明外，均采用 [BY-NC-SA](https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh) 许可协议。转载请注明出处！
- #HTML
- #Audio Player
AWS EC2实例迁移教程 上一篇
华为eSpace 7910如何添加铃声 下一篇
评论
代码语言：txt复制 function loadTwikoo() { twikoo.init({ el: '#twikoo-comment', envId: 'https://twikoo-vercel-server-nexmoe.vercel.app', }); } if ('true') { const loadTwikooTimeout = setTimeout(() => { loadTwikoo(); clearTimeout(loadTwikooTimeout); }, 1000); } else { window.addEventListener('DOMContentLoaded', loadTwikoo); }
