欢迎来到科站长!

HTML5

当前位置: 主页 > 网页制作 > HTML5

Html5播放器实现倍速播放的方法示例

时间:2023-12-30 21:21:10|栏目:HTML5|点击:

本文主要介绍了Html5播放器实现倍速播放的方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

定义和用法

playbackRate 属性设置或返回音频的当前播放速度。

playbackspeed

指示音频的当前播放速度。

例值:

  • 1.0 正常速度
  • 0.5 半速(更慢)
  • 2.0 倍速(更快)
  • -1.0 向后,正常速度
  • -0.5 向后,半速

示例代码1:

代码示例:

<video id="video" controls src="**.mp4" type="video/mp4"></video>
选择倍速播放:
<select id="select">
    <option value="0.5">0.5</option>
    <option value="1" selected>1.0</option>
    <option value="1.25">1.25</option>
    <option value="1.5">1.5</option>
    <option value="2">2.0</option>
</select>

示例2:

应用倍速实例。

<div id="player"></div>
<script src="//player.polyv.net/script/player.js"></script>
<script>
var player = polyvPlayer({
wrap: '#player',
width: 800,
height: 533,
vid: 'e785b2c81c9e018296671a1287e99615_e',
});
</script>
speedboolean/array[2, 1.5, 1.2, 0.5]设置为false则关闭倍速,可传入数组自定义显示哪几种倍速,速率1不需要填入,会自动添加,所设置速率值必须大于0,少于或等于3,最多设置6种速率(不包含1),所设置值会按由大到小自动排序

设置倍速代码如下:

<div id="player"></div>
<script src="//player.polyv.net/script/player.js"></script>
<script>
var player = polyvPlayer({
wrap: '#player',
width: 800,
height: 533,
speed:[2, 1.5, 1.2, 0.5], //倍速播放参数设定值
vid: 'e785b2c81c9e018296671a1287e99615_e',
});
</script>

到此这篇关于Html5播放器实现倍速播放的方法示例的文章就介绍到这了

上一篇:H5项目怎么打包成APP

栏    目:HTML5

下一篇:html中ul和li标签的用法详解

本文标题:Html5播放器实现倍速播放的方法示例

本文地址:https://fushidao.cc/wangyezhizuo/203.html

广告投放 | 联系我们 | 版权申明

申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:1205677645 | 邮箱:1205677645@qq.com

Copyright © 2018-2024 科站长 版权所有冀ICP备14023439号