audiojs – 随时随地播放 HTML5 的声音

Admin
Admin
Admin
52
文章
6
评论
2018年4月9日16:10:15 评论 11,252 874字阅读2分54秒

audio.js 是一个嵌入式 JavaScript 库,允许在任何地方使用 HTML5 的 <audio> 标签。它的原理是在可用的地方使用 <audio> 标签,并在不可使用的地方使用 Flash 播放器为其他浏览器模拟 <audio>,并且它为所有浏览器提供了一致的 HTM L播放器 UI,可以使用标准 CSS。

一、安装 audio.js

您可以从 官网 或者 GitHub 上将 audio.js下载到本地,然后把 audio.js、player-graphics.gif 与 audiojs.swf 在同一个文件夹中。

  1. git clone https://github.com/kolber/audiojs.git

注:源文件压缩的时候应该是少打包了一个 player-graphics@2x.gif 文件,你可以将 player-graphics.gif 文件复制一份,然后重命名为 player-graphics@2x.gif 。

二、浏览器兼容支持

  • Mobile Safari (iOS 3+)
  • Android (2.2+, w/Flash)
  • Safari (4+)
  • Chrome (7+)
  • Firefox (3+, w/Flash)
  • Opera (10+, w/Flash)
  • IE (6, 7, 8, w/Flash)

由于 mp3 是目前实际的音乐传输格式,所以 audio.js 专注于播放 mp3,它目前不支持 ogg 格式,ogg格式在优先级列表中支持较低。

三、如何使用 audio.js

1、引入 audio.js 文件

  1. <script src="/audiojs/audio.min.js"></script>

2、初始化 audio.js

  1. <script>
  2.   audiojs.events.ready(function() {
  3.     var as = audiojs.createAll();
  4.   });
  5. </script>

3、这样您就可以在 HTML 中随时随地使用 <audio> 标签了

  1. <audio src="/mp3/juicy.mp3" preload="auto" />

博主只是一名前端的小白,只是把自己用到的知识分享一下,要是有什么不对的地方,欢迎大家提出~~

继续阅读
Admin
  • 本文由 发表于 2018年4月9日16:10:15
  • 除非特殊声明,本站文章均为原创,转载请务必保留本文链接
Vue 中计算属性和侦听器 前端开发

Vue 中计算属性和侦听器

在 Vue 中通常我们会在模板绑定表达式,模板是用来描述视图结构的。如果模板中的表达式存在过多的逻辑性语句,那么整个模板就会变得特别的臃肿,可读性和维护性将会降低,因此为了简化逻辑,我们可以使用计算属...
浅谈 JS 中的防抖和节流操作 前端开发

浅谈 JS 中的防抖和节流操作

一般在进行窗口的 resize、scroll 等输入框内容校验等操作时,如果事件处理函数调用的频率无限制,会加重浏览器的负担,导致用户体验非常糟糕。此时我们可以采用 debounce(防抖)和 thr...
JS中的「import」和「require 」的区别 前端开发

JS中的「import」和「require 」的区别

import 和 require 是 JS 模块化编程使用的,模块化是一种将系统分离成独立功能部分的方法,一个模块是为完成一个功能的一段程序或子程序,"模块"是系统中功能单一且可替换的部分。模块化思想...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: