Aplayer搭配MetingJS音乐插件的使用
Aplayer搭配MetingJS
Aplayer官网文档:https://aplayer.js.org/#/
Metingjs官网文档:https://github.com/metowolf/MetingJS
Aplayer是一个功能强大的HTML5音乐播放器,Metingjs基于Aplayer插件封装好的插件,开箱即用。
MetingJS的简单使用
MetingJS支持Aplayer版本
Version | API Status | APlayer |
---|---|---|
1.2.x | Supported | 1.10.0 |
2.0.x | Latest | 1.10.0 |
支持的浏览器
- Chrome
- Firefox
- Safari
- Internet Explorer 11
- Microsoft Edge
简单使用
1 |
|
注意:server=”netease” type=”playlist” id=”7727259103” 你可以设置”netease“为网易云音乐,”tencent“为QQ音乐平台,id当你创建一个歌单之后右键分享歌单会出现一串数字(网易云),字母(QQ音乐)
Aplayer参数选择
选项 | 默认 | 描述 |
---|---|---|
id(编号) | require | 歌曲ID /播放列表ID /专辑ID /搜索关键字 |
server(平台) | require | 音乐平台:netease ,tencent ,kugou ,xiami ,baidu |
type(类型) | require | song ,playlist ,album ,search ,artist |
auto(支持类种 类) | options | 音乐链接,支持:netease ,tencent ,xiami |
fixed(固定模式) | false |
启用固定模式,默认false |
mini(迷你模式) | false |
启用迷你模式,默认false |
autoplay(自动播放) | false |
音频自动播放,默认false |
theme(主题颜色) | #2980b9 |
默认#2980b9 |
loop(循环) | all |
播放器循环播放,值:“all”,one”,“none” |
order(顺序) | list |
播放器播放顺序,值:“list”,“random” |
preload(加载) | auto |
值:“none”,“metadata”,“’auto” |
volume(声量) | 0.7 |
默认音量,请注意播放器会记住用户设置,用户自己设置音量后默认音量将不起作用 |
mutex(限制) | true |
防止同时播放多个玩家,在该玩家开始播放时暂停其他玩家 |
lrc-type(歌词) | 0 |
歌词显示 |
list-folded(列表折叠) | false |
指示列表是否应该首先折叠 |
list-max-height(最大高度) | 340px |
列出最大高度 |
storage-name(储存名称) | metingjs |
存储播放器设置的localStorage键 |
Aplayer的使用
将这行代码复制进你的网页,调整好参数,就可以开始自定义化你的播放器啦!
我的博客网页播放器配置示例:
1 | <!-- 引用Aplayer和metingjs --> |
- 标题: Aplayer搭配MetingJS音乐插件的使用
- 作者: 小颜同学
- 创建于: 2022-11-15 23:27:15
- 更新于: 2024-02-07 14:23:20
- 链接: https://www.wy-studio.cn/2022/11/15/Aplayer搭配MetingJS音乐插件的使用/
- 版权声明: 本文章采用 CC BY-NC-SA 4.0 进行许可。
评论