audiojs--跨浏览器的HTML音频播放器（可自定义样式）

一款跨浏览器的音频播放器，可惜例子和文档都比较少

英文文档 官网

使用方法：

第一步引用文件：

第二步，全局初始化：

  audiojs.events.ready(function() {    var as = audiojs.createAll();  });

第三步，在需要的地方放上下面类似的代码：

 //注意是直接闭合标签

然后，然后就没有了，WTF！！！

以上只适用静态的页面，如果动态添加音频怎么办？相信好多人都需要这种功能，我也是，费了很大功夫才找到一个方法，如下：

http://stackoverflow.com/ques...

看不懂？没关系，提取有效代码如下：

var as;audiojs.events.ready(function () {    as = audiojs.createAll();});$(document).ready(function () {    setTimeout(function () {        var mp3 = "http://s3.amazonaws.com/audiojs/02-juicy-r.mp3"; // audio.js example        // creating new audio element, yours is probably added via ajax        // [0] used to get DOM element instead of jQuery object.        var audio = $('', {id: 'test'}).appendTo('body').attr('src', mp3)[0];        var testAS = audiojs.create(audio); // initialise new audio.js player        as.push(testAS); // add "testAS" object to "as" array of objects        console.log(as); // log "as" - now holds the original objects + "testAS"    }, 5000); // timeout used for testing, above code can be in ajax success function instead});

控制HTML样式类名配置

createPlayer: {                markup: '                                                                                                                                     00:00/00:00                                 ',                playPauseClass: 'play-pause',                scrubberClass: 'scrubber',                progressClass: 'progress',                loaderClass: 'loaded',                timeClass: 'time',                durationClass: 'duration',                playedClass: 'played',                volumeClass: 'volume',                closingClass: 'closing',                errorMessageClass: 'error-message',                playingClass: 'playing',                loadingClass: 'loading',                errorClass: 'error'            },

关键字：JavaScript

版权声明

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！