html实现网页左下角音乐播放器
效果图如下:
实现代码如下:
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><link rel="stylesheet" href="/npm/aplayer@1.10.1/dist/APlayer.min.css"><script src="/npm/aplayer@1.10.1/dist/APlayer.min.js"></script><div id="aplayer" class="aplayer" data-autoplay="true" data-id="5208409284" data-server="netease" data-type="playlist" data-fixed="true" data-listfolded="true" data-order="random" data-theme="#F58EA8"></div><script src="/meting@1.2.0/dist/Meting.min.js"></script></body></html>
上面代码中使用的是网易云音乐,具体参数介绍如下:data-id: 歌曲/专辑/歌单ID
data-server: 音乐平台,支持如下参数:
netease (网易云音乐)
tencent (qq音乐)
xiami (虾米音乐)
kugou (酷狗音乐)
baidu (百度音乐)
data-type: 请求类型,支持如下参数:
song (单曲)
album (专辑)
playlist (歌单)
search (搜索)
data-mode: 播放模式,支持如下参数:
random (随机)
single (单曲)
circulation (列表循环)
order (列表)
data-autoplay: 自动播放 ,支持如下参数:
true
false