skPlayer是一款好看又简洁的HTML5网页音乐播放器,同时支持自定义歌单和网易云音乐歌单。skPlayer3.0仅需一个JS文件就可实现播放器的调用,播放列表可隐藏,各项控制参数可以单独自行选择启用。
skPlayer3.0播放器应用实例代码:
<div id="skPlayer"></div> <script src="http://www.chengfeilong.com/skPlayer/dist/skPlayer.min.js"></script> <script> var player = new skPlayer({ autoplay: true, music: { type: 'cloud', source: 317921676 } }); </script>
skPlayer3.0参数配置说明:
配置网易云音乐歌单方式:
var player = new skPlayer({ autoplay: true, //可选项,自动播放,默认为false,true/false listshow: true, //可选项,列表显示,默认为true,true/false mode: 'listloop', //可选项,循环模式,默认为'listloop' //'listloop',列表循环 //'singleloop',单曲循环 music: { //必需项,音乐配置 type: 'cloud', //必需项,网易云方式指定填'cloud' source: 317921676 //必需项,网易云音乐歌单id //登录网易云网页版,在网页地址中拿到 // ... playlist?id=317921676 } });
自定义配置音乐文件方式:
var player = new skPlayer({ ... //可选项配置同上 music: { //必需项,音乐配置 type: 'file', //必需项,自配置文件方式指定填'file' source: [ //必需项,音乐文件数组 { name: '打呼', //必需项,歌名 author: '潘玮柏&杨丞琳', //必需项,歌手 src: 'xxx.mp3', //必需项,音乐文件 cover: 'xxx.jpg' //必需项,封面图片 }, ... ] } });
API
播放
player.play();
暂停
player.pause();
播放/暂停切换
player.toggle();
上一首
player.prev();
下一首
player.next();
切歌
player.switchMusic(index);
//index为列表中歌曲前对应的序号
列表显示/隐藏切换
player.toggleList();
静音/正常切换
player.toggleMute();
单曲循环/列表循环切换
player.switchMode();
销毁
player.destroy();
//skPlayer默认只能存在一个实例
//需要重新配置时调用该方法销毁当前实例