如何在移动设备上通过HTML5改变视频的播放速度？

Question

如何在移动设备上通过HTML5改变视频的播放速度？

3

根据此网站所述，这在通过DOM访问的playbackRate和defaultPlaybackRate属性中得到支持。但是，在移动设备上无法正常工作。示例：

<!DOCTYPE html>

<video id="my-video" src="chubby-bubbies.ogv" ...></video>

<script type="text/javascript">
  /* play video twice as fast */
  document.getElementById("my-video").defaultPlaybackRate = 2.0;
  document.getElementById("my-video").play();

  /* now play three times as fast just for the heck of it */
  document.getElementById("my-video").playbackRate = 3.0;
</script>

上述方法适用于Chrome浏览器，也适用于桌面版Firefox 20及以上版本。

- Rajesh Kanna

我认为这与移动设备上的HTML视频限制有关。在用户点击播放之前，您无法控制视频元素。您也无法通过JS强制启动视频播放。 - mattdevio

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Tobias Kullblikk · Accepted Answer

答案很简单，移动版Chrome（Android）不支持播放速率更改，即使该网站声称它支持：https://developer.mozilla.org/en/docs/Web/API/HTMLMediaElement#AutoCompatibilityTable 这是真正支持移动端播放速率更改的浏览器：

Chrome 20+ ✔
Firefox 20+ ✔
IE 9+ ✔
Safari 6+ ✔
Opera 15+ ✔
Mobile Chrome (Android) ✖
Mobile Firefox 24+ ✔
IE Mobile ✖
Mobile Safari 6+ (iOS) ✔
Opera Mobile ✖

我创建了一个网站并通过首先将以下内容添加到web.config文件中进行了测试：

<system.webServer>
    <staticContent>
           <mimeMap fileExtension=".mp4" mimeType="video/mp4"/>
    </staticContent>
</system.webServer>

然后我将一个简单的视频上传到我的网站，并在Azure上进行测试以适应不同的浏览器：http://pandasneezy.azurewebsites.net/ 我建议您使用移动版Firefox 24+，并且它应该可以很好地运行： document.getElementById("my-video").playbackRate = 3.0;