给你的网站引入音乐播放器
AI-摘要
WenWen GPT
AI初始化中...
介绍自己
生成本文简介
推荐相关文章
前往主页
前往tianli博客
嵌入代码引入JS和CSS
<!-- require APlayer -->
<link rel="stylesheet" href="https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/aplayer/1.10.1/APlayer.min.css">
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/aplayer/1.10.1/APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https://cdn1.tianli0.top/npm/meting@2.0.1/dist/Meting.min.js"></script>
<!-- 配置你的 背景音乐信息 -->
<meting-js server="netease" type="playlist" id="5337368124" autoplay="true" preload="auto" fixed ="true" listFolded="true" order="random" >
</meting-js>
官方参数
名称 |
默认值 |
描述 |
container |
document.querySelector('.aplayer') |
播放器容器元素 |
fixed |
false |
开启吸底模式,详情 |
mini |
false |
开启迷你模式,详情 |
autoplay |
false |
音频自动播放 |
theme |
'#b7daff' |
主题色 |
loop |
'all' |
音频循环播放, 可选值: 'all', 'one', 'none' |
order |
'list' |
音频循环顺序, 可选值: 'list', 'random' |
preload |
'auto' |
预加载,可选值: 'none', 'metadata', 'auto' |
volume |
0.7 |
默认音量,请注意播放器会记忆用户设置,用户手动设置音量后默认音量即失效 |
audio |
- |
音频信息, 应该是一个对象或对象数组 |
- |
音频名称 |
|
audio.artist |
- |
音频艺术家 |
audio.url |
- |
音频链接 |
audio.cover |
- |
音频封面 |
audio.lrc |
- |
|
audio.theme |
- |
切换到此音频时的主题色,比上面的 theme 优先级高 |
audio.type |
'auto' |
可选值: 'auto', 'hls', 'normal' 或其他自定义类型,详情 |
customAudioType |
- |
自定义类型,详情 |
mutex |
true |
互斥,阻止多个播放器同时播放,当前播放器播放时暂停其他播放器 |
lrcType |
0 |
|
listFolded |
false |
列表默认折叠 |
listMaxHeight |
- |
列表最大高度 |
storageName |
'aplayer-setting' |
存储播放器设置的 localStorage key |
嵌入位置
自由选择,可以放在公告栏也可以放在页脚。
- 感谢你赐予我前进的力量
赞赏者名单
因为你们的支持让我意识到写文章的价值🙏
本文内容可能来自互联网,采用 CC BY-NC-ND 4.0 协议,完整转载请注明来自 404N
评论
匿名评论
隐私政策
你无需删除空行,直接评论以获取最佳展示效果