插件描述：高度可定制的Web音乐播放器插件MPlayer

MPlayer音乐播放器

MPlayer V2.0.0贺新春版于2017.01.01正式发布，本次更新要点： 1. 代码重写，拆分核心功能和特效，只为更好的自定义 2. 支持HTML结构自定义，只需添加指定class即可 3. 新增诸多API接口，方便调用 4. 删除部分无用的配置项 5. 新增多个回调函数 6. 新增多个配置项

截图

开始使用

简单的使用MPlayer

HTML结构

MPlayer完整版的HTML结构，可自定义

HTML

引入CSS和JS

您需要在页面中引入一个CSS和一个JS文件

HTML

请自行修改路径

初始化播放器

您需要用一段JavaScript代码来创建一个MPlayer播放器

JavaScriptnew MPlayer({

// 容器选择器名称

containerSelector: '.mp',

// 播放列表，格式请参考mplayer-list.js

songList: mplayer_song,

// 专辑图片错误时显示的图片

defaultImg: 'img/mplayer_error.png',

// 自动播放

autoPlay: false,

// 播放模式(0->顺序播放,1->单曲循环,2->随机播放,3->列表循环(默认))

playMode:0,

// 第一首播放的列表

playList:0,

// 第一首播放的歌曲

playSong:5,

// 当前歌词距离顶部的距离

lrcTopPos: 34,

// 列表模板，用${变量名}$插入模板变量

listFormat: '

${name}$${singer}$${time}$',

// 音量滑块改变事件名称

volSlideEventName:'change',

// 初始音量

defaultVolume:80

});

参数说明名称说明默认值是否选填接受类型版本号

containerSelector包裹MPlayer播放器的容器，可设置多个无否jQuery Selector1.3.3及以上

songList歌曲播放列表，格式请参考mplayer-list.js无否Array1.0.0及以上

defaultImg专辑图片错误时显示的图片无否String2.0.0及以上

autoPlay初始化完成后是否自动播放true是Boolean1.2.0及以上

playMode播放模式(关于播放模式)0是Int1.0.0及以上

playList第一首播放的歌曲所属的列表序号0是Int1.0.0及以上

playSong第一首播放的歌曲在列表中的索引(忽略basic)0是Int1.0.0及以上

以下配置项已被移除

playRotate播放时专辑图片是否旋转(已于V2.0.0移除)true是Boolean仅1.3.3

useDefaultStyle您是否正在使用默认样式(如果您对样式有了大幅度调整或重写了样式，请将此项设置为false，否则您的排版可能会错乱)(已于V2.0.0移除)true是Boolean仅1.3.3

lrcHeight歌词区域的高度(当useDefaultStyle设置为false时本配置项无效)(已于V2.0.0移除)160是Int仅1.3.3

beforePlay每首歌播放开始前的回调函数，接受一个参数作为歌曲信息(V2.0.0回调函数不在配置项中绑定，详情)无是Function1.3.3及以上

canPlay歌曲缓冲到可以播放时的回调函数(用户跳跃播放时间时同样会触发)，接受一个参数作为歌曲信息(已于V2.0.0移除)无是Function仅1.3.3

回调函数

MPlayer2.0.0采用了通过回调函数绑定事件的方法，代码如下

JavaScriptnew MPlayer(options,function () {

this.on(eventName, callback);

});函数名触发时间返回值

afterInit初始化完成-

beforePlay播放前返回fasle可以取消播放

timeUpdate时间变化时-

end播放完毕后返回fasle可以取消播放下一首

mute静音状态改变时-

changeMode播放模式改变时-

所有回调函数已使用apply改变了this指向，您可以直接在回调函数中使用this代指MPlayer对象