黄聪:原生js的音频播放器,兼容pc端和移动端(原创)
更新时间:2018/9/3 下午1:32:54
更新说明:添加音乐的loop设置和ended事件监听
loop为ture的时候不执行ended事件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
const wx = new WxAudio({ ele: '.wx-audio' , title: '河山大好' , disc: '许嵩' , src: '。。。。' , width: '320px' , loop: true , ended: function () { var src = '。。。。' var title = '她说' var disc = '林俊杰' wx.audioCut(src, title, disc) } }) |
发布时间:2018-4-4 1:01
wx-audio
微信公众号音乐播放器
基于原生js写的一款仿微信公众号的音乐组件
实例化 音乐组件
1
2
3
4
5
6
7
|
var wxAudio = new Wxaudio({ ele: '#textaudio1' , title: '河山大好' , disc: '许嵩' , width: '320px' }); |
方法
1
2
3
4
5
6
|
// 实例化的wxAudio可以这样操作 wxAudio.audioPlay() // 播放 wxAudio.audioPause() // 暂停 wxAudio.audioPlayPause() // 播放暂停 wxAudio.showLoading(bool) //显示加载状态 参数bool wxAudio的audioCut(src,title,disc) 实现音频切换的效果 |
新增 音乐组件切歌方法
通过实例化的wxAudio的audioCut(src,title,disc) 实现音频切换的效果 示例代码如下
1
2
3
4
|
var src = '.....mp3' var title = '她说' var disc = '林俊杰' wxAudio.audioCut(src, title, disc) |
网址:http://www.jq22.com/jquery-info18575
下载:jq22wx-audio2691201804040100.zip
黄聪:原生js的音频播放器,兼容pc端和移动端(原创)的更多相关文章
- 原生JS实现音乐播放器!
前 言 最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播放的同时支持图片的 ...
- 【jquery】一款不错的音频播放器——Amazing Audio Player
前段时间分享了一款视频播放器,点击这里.今天介绍一款不错的音频播放器——Amazing Audio Player. 介绍: Amazing Audio Player 是一个使用很方便的 Windows ...
- Wavesurfer.js音频播放器插件的使用教程
Wavesurfer.js是一款基于HTML5 canvas和Web Audio的音频播放器插件,本文主要记录它及其视觉效果插件Regions插件的使用方法. 1.创建实例 引入插件 import W ...
- JS实现音乐播放器
JS实现音乐播放器 前 言 最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播 ...
- 基于canvas和Web Audio的音频播放器
wavesurfer.js是一款基于HTML5 canvas和Web Audio的音频播放器插件.通过wavesurfer.js你能够使用它来制作各种HTML5音频播放器,它能够在各种支持 Web A ...
- HTML5 音频播放器-Javascript代码(短小精悍)
直接上干货咯! //HTML5 音频播放器 lzpong 2015/01/19 var wavPlayer = function () { if(window.parent.wavPlayer) re ...
- IOS开发之简单音频播放器
今天第一次接触IOS开发的UI部分,之前学OC的时候一直在模拟的使用Target-Action回调模式,今天算是真正的用了一次.为了熟悉一下基本控件的使用方法,和UI部分的回调,下面开发了一个特别简易 ...
- 与众不同 windows phone (14) - Media(媒体)之音频播放器, 视频播放器, 与 Windows Phone 的音乐和视频中心集成
原文:与众不同 windows phone (14) - Media(媒体)之音频播放器, 视频播放器, 与 Windows Phone 的音乐和视频中心集成 [索引页][源码下载] 与众不同 win ...
- Unity3D音频播放器 动态装载组件
大多数在线Unity有关如何只教程Unity在播放音乐.之后如何通过拖动它们无法继续添加音频文件 但有时在游戏中的对象要玩几个声音.这时候我们就需要使用代码控制,拖动推教程AudioClip颂值的方法 ...
随机推荐
- js中的正则
闭包: 函数在调用的时候会形成私有的作用域,对内部的变量起到保护的作用,这就是闭包: 变量销毁: 1.人为销毁 : var a = 12: a = null: 2.孜然销毁 : 函数在调用完之后, ...
- Centos解除端口占用
- 查看所有端口占用 - netstat -tln - 查看端口被哪个进程占用 - lsof -i:端口号 - 杀死被占用端口 - kill 端口号
- Linux系统安装与初用
1.结合实验尝试,并查阅资料,总结在实验准备中提出的7个问题. (1).Linux的发行版本.内核版本:二者区别与联系. 核心版本主要是Linux的内核,发行版本是各个公司推出的版本,他们与核心版本是 ...
- php中print、echo、print_r、var_dump的区别
echo,print,print_r,var_dump区别 print只能接收一个字符串:print有返回值1(可在表达式中使用) e.g print 'string 1' e.g if($exp & ...
- java语言基础--接口
接口定义: 是一个特殊的抽象类,在接口里面的所有方法都是抽象的. 接口用interface来声明. 注意: 接口中只能出现常量和抽象方法: 接口里面没有构造方法,无法创建接口的对象: 接口和接口之间支 ...
- Byte数组和字符串相互转换的问题
第一:需求:将文件转成byte数组,之后转成字符串返回.过滤器接收到响应内容后,需要将响应的内容转成byte数组. 第二:我刚开始的做法: Controller:byteArr = Conversio ...
- Python学习笔记–Chapter 2
1.字符串中添加制表符,可使用字符组合\t 2.字符串中添加换行符,可使用字符组合\n 3.字符串\n\t可以换到下一行,并且在开头添加一个制表符. 4.删除末尾空白,使用方法rstrip() 5.删 ...
- js中substr、substring、slice的区别
substr(start, length) substring(from, to) slice(from, to) 以上函数只传一个参数时,认为是起始位置,然后按照正方向截取 substring的参数 ...
- laravel 修改时邮箱字段唯一性验证时忽略指定 ID
- tornado上帝视角第一次建立WEB服务器
import tornado.ioloop import tornado.web 该视角建立在SOCKET服务端和客户端的基础上. class MainHandler(tornado.web.Requ ...