首页 > 其他分享 >videojs调整音频播放语速

videojs调整音频播放语速

时间:2022-10-13 22:03:25浏览次数:94  
标签:function 音频 playbackRate player video var 语速 speed videojs

参考:

​https://stackoverflow.com/questions/19112255/change-the-video-playback-speed-using-video-js​

以下代码相比stackoverflow添加了一个延时,否则无法正常播放,官方文档并没有相关过多说明,不理解具体原因
var player = videojs('example-video');
player.ready(function() {
var _this = this
//速率
var playbackRate = $("#playbackRate").val();
var speed = parseFloat(playbackRate);
setTimeout(function() {
_this.playbackRate(speed);
},20);
});
...
player.play();
$("#playbackRate").change(function(){
var speed = $(this).val();
$("#playbackRateLabel").text("x"+speed+"倍速");
});
<audio id=example-video preload="auto" class="video-js vjs-default-skin" type="audio/wav" hidden="hidden">
<input type="range" min="0.5" max="2" value="1" id="playbackRate" step="0.5"/><span id="playbackRateLabel">×1</span>

<script type="text/javascript" th:src="@{/js/jquery3.4.1.js}"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/video.js/7..0.0/video.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.6.0/lang/zh-CN.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js"></script>
<script src="https://cdn.bootcss.com/layer/2.3/layer.js"></script>
<link href="https://cdn.bootcss.com/layer/2.3/skin/layer.css" rel="stylesheet">

 

标签:function,音频,playbackRate,player,video,var,语速,speed,videojs
From: https://blog.51cto.com/u_296714/5754726

相关文章

  • 【音视频连载-008】基础学习篇-SDL 播放 PCM 音频文件(下)
    公众号回复:OpenGL,领取学习资源大礼包音视频学习入门技术文章连载:​​技术开发故事会连载​​​​【音视频连载-001】基础学习篇-SDL介绍以及工程配置​​​​【音视频连载-......
  • videojs播放直播
    index.html引入css和js<linkhref="https://cdn.bootcdn.net/ajax/libs/video.js/7.10.1/alt/video-js-cdn.min.css"rel="stylesheet"><scripttype="text/javascrip......
  • 恒玄BES2300蓝牙音频SoC,WiFi/BT双模AIoT SoC芯片
    BES2300有多个版本、后缀不同配置也不尽相同。BES2300系列是全集成自适应主动降噪方案,支持蓝牙5.0、IBRT蓝牙监听技术和双模蓝牙4.2,它还支持第三代FWS全无线立体声技术、......
  • 《视音频处理》期末作品要求
    1. 主题(1) 中国传统节日(2) 我的家乡(3) 毕业短片以上主题任选其一,作品名称自拟,可选择制作MV、混剪、微电影等形式,视频内容要紧扣主题、内容积极向上,表现一定的精神......
  • audio不播放音频
    做消息推送有提示音。由于google默认不播放音频,除非有鼠标,键盘事件触发才播放,所以给页面头部加了一个按钮是否打开消息提示音。触发后开启音频调用音频方法。(当你打开一......
  • python 音频合成,图片转视频
    importosimportcv2,reimporttimeimportpyttsx3importffmpegimportsubprocessfromPILimportImageimportnumpyasnpimportimageioimageio.plugins.freeimage.dow......
  • 备忘录怎么添加音频 备忘录添加音频方法
    很有小伙伴在使用手机备忘录记录事情的时候,如果遇到一些比较紧急的事情,就会想要先用声音的方式记录下来,稍后闲暇时再进行整理。不过有的人不知道手机备忘录怎么添加音频,这......
  • 12_采样格式&音频重采样
    采样格式通过前面学习我们知道FFmpeg和SDL都有自己的采样格式的表达式,那么他们都表示什么意思呢?FFmpeg的采样格式的表达式:enumAVCodecID{......AV_CODEC_ID......
  • 08_音频录制02_编程
    通过编程录音开发录音功能的主要步骤是:注册设备获取输入格式对象打开设备采集数据释放资源需要用到的FFmpeg库有4个。extern"C"{//设备相关API#include<l......
  • 07_音频录制01_命令行
    终于要开始进行FFmpeg实战了,一起来感受一下FFmpeg的强大吧。命令简介FFmpeg的bin目录中提供了3个命令(可执行程序),可以直接在命令行上使用。ffmpegffmpeg的主要作用:对......