wx-audio
微信公众号音乐播放器
基于原生js写的一款仿微信公众号的音乐组件
演示地址
http://www.daiwei.org/components/wx-audio/
手机预览
安装
npm 安装
npm install wx-audio
引入
普通资源引入,先将es5文件下的目录放到自己的项目中,然后根据路径引入
实例化 音乐组件
var wxAudio = ele: '#textaudio1' title: '河山大好' disc: '许嵩' src: 'http://oiq8j9er1.bkt.clouddn.com/%E8%AE%B8%E5%B5%A9%20-%20%E6%B2%B3%E5%B1%B1%E5%A4%A7%E5%A5%BD1.mp3' width: '320px' loop: true { };
属性
- ele dom对象
- title 音乐标题
- disc 描述,可以当做显示歌手名称
- src 地址
- width 显示的宽度
- loop 是否循环(当循环状态下时候,ended事件不会执行)
- ended 方法,是一个回调,可在音乐播放结束之后执行其他的代码
方法
// 实例化的wxAudio可以这样操作wxAudio // 播放 wxAudio // 暂停 wxAudio // 播放暂停 wxAudio //显示加载状态 参数bool wxAudio 实现音频切换的效果
新增 音乐组件切歌方法
通过实例化的wxAudio的audioCut(src,title,disc) 实现音频切换的效果 示例代码如下
var src = 'http://oiq8j9er1.bkt.clouddn.com/%E6%9E%97%E4%BF%8A%E6%9D%B0%20-%20%E5%A5%B9%E8%AF%B41.mp3' var title = '她说' var disc = '林俊杰' wxAudio