给你的网站或博客添加QQ音乐/网易云音乐歌单音乐播放器

  • 内容
  • 相关

互联网多姿多彩,网页也少不了我们去探索,特别是我们自己的网站,等个人站,写文章的时候,写代码的时候,我们无聊可以听听哥放松放松无聊的心情。

給自己网站添加一个歌单播放器,让你的网站更加完美。

歌单需要API,我博客提供网易云音乐和QQ音乐歌单的API接口,可调用自己歌单的音乐。

给自己网站添加一个歌单播放器:

首先在你网站要添加播放器的页面添加以下代码:

先确保你页面引入了jQuery.js,没有就在头部</head>之前添加:

<script type="text/javascript" src="//mat1.gtimg.com/libs/jquery/1.9.1/jquery.min.js"></script>

在头部</head>之前引入播放器样式CSS:

<link rel="stylesheet" href="//cdn.staticfile.org/aplayer/1.10.1/APlayer.min.css">

在底部</body>前引入播放器JS文件:

<script src="//cdn.staticfile.org/aplayer/1.10.1/APlayer.min.js"></script>

然后在你要添加播放器的地方添加主要代码:

<div id="aplayer"></div> <script language="JavaScript"> var music = new Array(); $.ajax({ type: "GET", url: 'https://api.mlwei.com/music/api/?key=523077333&id=3641614987&type=songlist&cache=1&size=m4a',//歌单API接口  dataType: 'json', success: function(result){ var ap = new APlayer({ element: document.getElementById('aplayer'), lrcType: 3,//歌词类型  volume: 1,//音量,100%  mutex: true,//互斥打开,阻止多个播放器同时播放,当前播放器播放时暂停其他播放器  fixed: true,//吸底模式,就是本站左下角播放器样式  theme: '#45B6F7',//播放器主题色  autoplay: true,//自动播放打开,关闭改成 false  order: 'list',//顺序播放,随机播放改成random  audio: result.Body }); } }); </script>

然后刷新页面即可。

评论后还是无法显示下载地址?点我试试
热度:798° 评分:8.7 发布时间: 2019年1月13日

本文标签:

版权声明:若无特殊注明,本文皆为《小洋vier》原创,转载请保留文章出处。

本文链接:给你的网站或博客添加QQ音乐/网易云音乐歌单音乐播放器 - https://www.wuiso.com/post-1217.html

发表评论

电子邮件地址不会被公开。 必填项已用*标注