在自己的网站上添加HTML悬浮音乐播放器APlayer & MetingJS

官方文档

https://github.com/MoePlayer/APlayer
https://github.com/metowolf/MetingJS

引入线上的js代码放到你的HTML结构页面中，link链接放在head内部即可。

替换div中的网易云ID号即可

在header上添加

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/APlayer.min.js"></script>

在body上添加

<div id="aplayer" class="aplayer" data-order="random" data-id="2916766519" data-server="netease" data-type="playlist" data-fixed="true" data-autoplay="true" data-volume="0.8"></div>

在footer上添加

<!-- aplayer -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/Meting.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/kaygb/kaygb@master/js/v3.js"></script>
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/kaygb/kaygb@master/layer/layer.js"></script>

必要的参数

data-id =>音乐页面链接上的id号
data-server => 平台名称。netease：网易；tencent：腾讯；xiami：虾米；kugou：酷狗；baidu：百度
data-type=>类型。playlist：歌单；song：单曲；专辑：album；关键词：search；歌手：artist

效果