HTML5 playbackRate and Firefox

HTML5 playbackRate and Firefox

本文关键字：Firefox and playbackRate HTML5      更新时间：2023-09-26

我有一个带有HTML5视频播放器的页面。我使用jQuery创建了一个非常简单的播放速度切换按钮。

用户单击该按钮，每次按下都会将视频的播放速率属性的速度乘以 2。

所以你可以从1x到2x，4x，8x，16x，32x，64x，128x...等等。

但是，在 Firefox 中，我页面上的视频播放率永远不会超过 5 倍。

一旦播放速率为 4，并且脚本将其乘以 2 - 它就会变成 5(而不是 8(。

在谷歌浏览器中测试同一页面时不会发生此问题。

这是我的脚本：

$('#change_speed').click(function()
{
  var current_speed = ($('#video').get(0).playbackRate).toFixed(0);
  console.log('playback speed: ' + $('#video').get(0).playbackRate); //For debugging
  if(current_speed == 0)
  {
     $('#video').get(0).playbackRate = 1;
  }
  else
  {
    $('#video').get(0).playbackRate = $('#video').get(0).playbackRate * 2;
  }
});

我的函数中没有更多的代码。没有其他处理程序或脚本干扰。我点击按钮，在乘数之前中断：播放速率为4。乘数后中断，播放速率为5。

如果为 1，则乘数返回 2。如果为 2，则乘数返回 4。如果为 4，则乘数返回 5。...什么！？

在Chrome中，速度按预期不断翻倍。为什么在火狐中上限为 5？我错过了什么吗？

来自 MDN

大多数浏览器在 0.5 和 4 的播放速率范围之外停止播放音频，使视频保持静默播放。因此，对于大多数应用程序，建议将范围限制在 0.5 到 4 之间。

编辑：每个浏览器处理超出此建议范围的方式不同。Firefox 恰好将值范围从 0.5 固定到 5。铬夹从 0.5 到 16。如果你超出推荐的范围，你会在所有浏览器中得到不同的行为，所以我建议在你的代码中将其固定为 4x。

相关文章：