资讯专栏INFORMATION COLUMN

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

GHOST_349178 / 1300人阅读

摘要:一款跨浏览器的音频播放器,可惜例子和文档都比较少英文文档官网使用方法第一步引用文件第二步,全局初始化第三步,在需要的地方放上下面类似的代码注意是直接闭合标签然后,然后就没有了,以上只适用静态的页面,如果动态添加音频怎么办相信好多人都需要这种

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

英文文档 官网

使用方法:

第一步引用文件:

第二步,全局初始化:

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

然后,然后就没有了,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 = $("

控制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" },

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/91621.html

相关文章

  • videojs--览器HTML视频放器可自定义样式

    摘要:官网写在前面,为什么选择这个播放器,因为有文档,支持添加插件,很方便自定义样式,比较活跃,有各种解决方案等不过没想到有那么多坑最简单的静态页面使用方法动态插入时初始化方法或者或者更多详细使用方法请查看官方文档常见问 官网 写在前面,为什么选择这个播放器,因为有文档,支持添加插件,很方便自定义样式,比较活跃,github有各种bug解决方案等不过没想到有那么多坑 最简单的静态页面使用方法...

    klinson 评论0 收藏0
  • javascript功能插件大集合 前端常用插件 js常用插件

    摘要:转载来源包管理器管理着库,并提供读取和打包它们的工具。能构建更好应用的客户端包管理器。一个整合和的最佳思想,使开发者能快速方便地组织和编写前端代码的下一代包管理器。很棒的组件集合。隐秘地使用和用户数据。 转载来源:https://github.com/jobbole/aw... 包管理器管理着 javascript 库,并提供读取和打包它们的工具。•npm – npm 是 javasc...

    netmou 评论0 收藏0
  • javascript功能插件大集合 前端常用插件 js常用插件

    摘要:转载来源包管理器管理着库,并提供读取和打包它们的工具。能构建更好应用的客户端包管理器。一个整合和的最佳思想,使开发者能快速方便地组织和编写前端代码的下一代包管理器。很棒的组件集合。隐秘地使用和用户数据。 转载来源:https://github.com/jobbole/aw... 包管理器管理着 javascript 库,并提供读取和打包它们的工具。•npm – npm 是 javasc...

    Hydrogen 评论0 收藏0
  • javascript功能插件大集合,写前端亲们记得收藏

    摘要:一个专注于浏览器端和兼容的包管理器。一个整合和的最佳思想,使开发者能快速方便地组织和编写前端代码的下一代包管理器。完全插件化的工具,能在中识别和记录模式。健壮的优雅且功能丰富的模板引擎。完整的经过充分测试和记录数据结构的库。 【导读】:GitHub 上有一个 Awesome – XXX 系列的资源整理。awesome-javascript 是 sorrycc 发起维护的 JS 资源列表...

    cfanr 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<