vue实现静音播放video标签（视频/视频流）

可以通过控制音量来解决该问题

通过volume 属性把音量降到0

html代码

示例代码测试环境为播放视频流,视频流使用js加载到video标签中，相关代码没有贴出

 <video id="localVideo"ref="localVideo"autoplayplaysinline>
</video>

js代码参考

 this.$nextTick(() => {//调整音量为0this.$refs.localVideo.volume = 0;})

通过video标签的muted属性无效

在项目实践中，发现在通过video播放视频流时，使用muted 属性并不能静音，muted 加在html或者js中都没有效果

vue实现静音播放video标签（视频/视频流）相关推荐

谷歌chrome浏览器无法自动播放video标签视频的问题
问题根源详见:Chrome中的自动播放政策>> https://developer.chrome.com/blog/autoplay/ The Autoplay Policy launc ...
ios html5 自动全屏播放,禁止iPhone Safari video标签视频自动全屏的办法
最近做一个移动端微信页面项目,在微信页面中有视频播放,但是需要禁止IOS的自动全屏播放(前提必须使用video标签). 如: 在iPhone safari 点击视频会弹出播放器进行全屏播放. 在网上看 ...
video 满屏显示_微信video标签视频设置全屏属性
微信video标签视频设置全屏属性,支持安卓和ios系统的视频控制器和播放按钮隐藏和视频全屏,微信使用的内核是X5 x-webkit-airplay="true" x5-video ...
vue中使用h5 video标签实现弹窗播放本地视频
参考h5 < video >标签的用法在开发过程中主要涉及到以下几个需要关注的点 1.弹窗的打开关闭父组件中使用.sync绑定visible属性,可直接在子组件中关闭弹窗更新父组件传入 ...
【实战问题】【3】iPhone无法播放video标签中的视频
问题:视频都是MP4格式,视频可以在手机上正常播放.video标签中的视频在安卓点击可以播放,但在iPhone无法播放解决方案: 1,视频编码格式问题,具体iPhone手机支持的是哪些格式可见官方的 ...
HTML5 页面video标签视频加载播放空白
bug现象 : 空白原因 : video标签不支持我自己视频的编码格式注: 此处所说的编码格式不是指文件后缀 mp4 , RMVB , avi等 , 同一种后缀视频也会有不同编码格式 video标 ...
前端| js动态修改video标签视频不刷新的问题
问题描述:在网页上用<video>标签放一个视频播放器,点击视频目录来自动播放不同的视频.通过js动态生成li,点击li之后更改<video>标签<source>中 ...
第一次在Vue项目中播放m3u8格式视频遇到的问题和解决方法
一.m3u8文件第一次接触这种m3u8格式的视频文件,开始以为类似与.mp4这种,所以在项目中我通过html5提供的video标签做播放功能发现并不能成功,后来了解到M3U8文件是一种UTF-8编码 ...
H5 VIDEO标签视频黑屏的原因及解决方法
<video style="width:90%;height:300px;" controls="" poster="/upload/image ...

vue实现静音播放video标签（视频/视频流）

html代码

js代码参考

vue实现静音播放video标签（视频/视频流）相关推荐

最新文章

热门文章