根据Jrohy的QPlayer重做的一款简洁小巧的HTML5底部悬浮音乐播放器,目前只支持网易云哈
演示图片
![图片[1]-HTML5底部悬浮音乐播放器单页版-乡野博文](http://www.zau.cn/wp-content/uploads/2022/06/20220610071656.png)
我做成了单页 当然如果你比较懒 可以调用我的,我的可能会随时会倒闭(哈哈哈)
如果你是博客程序比如:WordPress等 作者做了插件,当然也可以用我这样的.
GIT:https://moeshin.github.io/QPlayer2/demos (自行看下)
我改的比较简单,只适合做新手。也做了一个解析接口页面一起放在里面了
![图片[2]-HTML5底部悬浮音乐播放器单页版-乡野博文](http://www.zau.cn/wp-content/uploads/2022/06/aebh9-br8xq-1024x481.jpg)
解析后复制内容在播放代码里面修改歌曲
添加歌曲如下图
![图片[3]-HTML5底部悬浮音乐播放器单页版-乡野博文](http://www.zau.cn/wp-content/uploads/2022/06/a5duf-o91k1-1024x275.jpg)
![图片[4]-HTML5底部悬浮音乐播放器单页版-乡野博文](http://www.zau.cn/wp-content/uploads/2022/06/agobd-b5wgv-1024x296.jpg)
{ 开始
}, 结束
如果你想要调用我的 那我的代码是这样的(后期我会修改接口方法等…也可能倒闭)直接复制一下代码到你的网站主文件下方或者底部文件(用我的歌曲就改不下来了)
这个我默认了是让他进入自动展开歌词/列表-如果你不想请你屏蔽/删除JS代码
<link rel="stylesheet" href="QPlayer.css">
<script src="QPlayer.js"></script>
<script src="script.js"></script>
<script src="style.css"></script>
<script id="js-code">
window.QPlayer.list = [
<!-- 从这个下面开始复制 -->
{
"name": "西海情歌",
"artist": "刀郎",
"audio": "https://api.i-meto.com/meting/api?server=netease&type=url&id=77098&auth=233613320533d9c2c4ba4578411a7f3082224a3e",
"cover": "https://api.i-meto.com/meting/api?server=netease&type=pic&id=45079976739605&auth=2f4e8e4c4906fe2f0976a7d4a14aa95cbae6dbf3",
"lrc": "https://api.i-meto.com/meting/api?server=netease&type=lrc&id=77098&auth=4b02eb3bccfd1ebbd355ad2b68ddce5dcf6ece39"
},
{
"name": "冲动的惩罚",
"artist": "刀郎",
"audio": "https://api.i-meto.com/meting/api?server=netease&type=url&id=77469&auth=872197177f66a94b7dbd3f5fa589d664824e52d3",
"cover": "https://api.i-meto.com/meting/api?server=netease&type=pic&id=109951163281535703&auth=f87a3998b5d07baaa3979308db40b3fe278a2835",
"lrc": "https://api.i-meto.com/meting/api?server=netease&type=lrc&id=77469&auth=59951cfcbb9e926eb7874afb9f8a41c2d35b7edc"
},
{
"name": "水中花+半梦半醒之间",
"artist": "刀郎 / 谭咏麟",
"audio": "https://api.i-meto.com/meting/api?server=netease&type=url&id=5265227&auth=8ce2d2260b1da4acc6e4067ba4e8353794c0fad9",
"cover": "https://api.i-meto.com/meting/api?server=netease&type=pic&id=109951163877210795&auth=011b549704c42f3315c4970a802ccb09cbd312ef",
"lrc": "https://api.i-meto.com/meting/api?server=netease&type=lrc&id=5265227&auth=d566bc2bda44af983558d37ef8f319837073ae4b"
}
<!-- 复制歌单到了这里就行 -->
];
</script>
您阅读这篇文章共花了: 0小时00分00秒
THE END
暂无评论内容