javascript - 用于单个页面上单个音频元素的 jQuery 预加载器

标签 javascript jquery css html

我有一个单页应用程序,该应用程序将多个音频文件加载到文档中。我创建了一个名为“.spinner”的类的预加载器微调器。在加载完成之前,我将如何为每个单独的音频元素显示此预加载器微调器?

最佳答案

根据 this this 以下事件在加载过程中按顺序发生:

  1. loadstart - 开始加载媒体时发送。
  2. durationchange - 元数据已加载或更改,指示媒体持续时间的更改。例如,当媒体加载足够多以至于持续时间已知时,就会发送此消息。
  3. loadedmetadata - 媒体的元数据已完成加载;所有属性现在都包含尽可能多的有用信息。
  4. loadeddata - 媒体的第一帧已完成加载。
  5. 进度 - 定期发送以通知感兴趣的各方下载媒体的进度。 media 元素的 buffered 属性提供了有关当前已下载媒体数量的信息。
  6. canplay - 当有足够的数据可以播放媒体时发送,至少播放几帧。
  7. canplaythrough - 当就绪状态变为 CAN_PLAY_THROUGH 时发送,表明整个媒体可以不间断地播放,假设下载速率至少保持在当前水平。注意:手动设置 currentTime 最终会在 firefox 中触发 canplaythrough 事件。其他浏览器可能不会触发此事件。

所以看看这些事件,您可以使用其中的 2 个:loadstartprogress。或者,您可以使用音频元素的 durationcurrentTime 属性,例如 here .

关于javascript - 用于单个页面上单个音频元素的 jQuery 预加载器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23872894/

相关文章:

html - CSS 3 动态列,宽度相同顶部对齐

javascript - 检测英语或法语中未找到的所有口音

javascript - 当视口(viewport)太小时隐藏侧边栏

css - 如何让 sass 编译 css 的开发和生产版本?

jquery - css 变换比例和 jquery bug

javascript - 将 Chart JS 2 上的条形图扩展为一种新型图表

javascript - 在线托管 node.js 项目

javascript - 使用 Vue I18n 和大内容文本 html 的最佳方式

javascript - 如何使用 CSS 过渡切换重叠元素?

javascript - 单击复选框后未收到复选框事件