无法在Firefox中隐藏HTML5视频标签 [英] Unable to Mute HTML5 Video Tag in Firefox

问题描述

我想用webrtc进行视频通话。我有两个流，一个是本地流，另一个是远程流。

在Chrome中，我将视频标签静音，以免听到导致回音的声音。我的HTML标记就像;

pre $ lt; code>< video style =position：absolute; right：5px; bottom：5px; display：一致; class =localVideoautoplay =autoplay
muted =true
src =mediastream：3ffffe01-da89-44d9-b9cf-454b11ec6a6aheight =25％width =25％ >< /视频>

在Firefox中 muted =true属性不起作用，听到我自己的声音。我尝试在其他主题中用很多方法来设置静音程序，比如：

  var video = document.querySelector（＃movie） ; 
 video.muted = true; 
  

使用jquery的这个代码片段的不同变体没有奏效。

然后，我决定将控件属性添加到视频标签，以观察Firefox控件按钮的工作原理。我已经看到，Firefox控制器上的静音按钮也不起作用。

在Firefox 35和Firefox ESR 31.5中，Windows 7-8.1，macOS优胜美地。我得到的媒体流通过webrtc库localStream。

这是一个已知的问题，如果有的话是否有任何解决方法克服这个问题？

谢谢。

解决方案

我也遇到过这个问题，我发现最简单的解决方案是使用 onloadedmetadata 事件如下：

  video {width：200px; height：200px;}  

< video src =https ：//scontent-lhr3-1.cdninstagram.com/t50.2886-16/12930587_1020784647992081_252978711_n.mp4onmouseenter =play（）onmouseleave =pause（）>

I want to make a video call with webrtc. I have two streams, one is local and the second one is remote stream.

In Chrome, I mute my video tag in order not to hear my voice which leads to echo. My HTML tag is like;

<video style="position:absolute;right:5px;bottom:5px;display: inline;" class="localVideo" autoplay="autoplay" 
muted="true" 
src="mediastream:3ffffe01-da89-44d9-b9cf-454b11ec6a6a" height="25%" width="25%"></video>

In Firefox muted="true" property not working, so that I hear my own voice. I tried to set muted propery with many ways in other topics like;

var video = document.querySelector("#movie");     
video.muted = true;

different variations of this code snippet with jquery didn't worked.

Then I've decided to add controls property to the video tag, in order to watch how Firefox control buttons works. I've seen that mute button on Firefox controller doesn't works either.

This issue occurs in both Firefox 35 and Firefox ESR 31.5 with windows 7 - 8.1, macOS with Yosemite. I get media stream via webrtc libraries localStream.

Is this a known issue, if so is there any workaround to overcome this issue?

Thanks.

解决方案

I also came across this issue with Firefox, the simplest solution I've found is using the onloadedmetadata event as below:

video {
  width: 200px;
  height: 200px;
}

<video
  src="https://scontent-lhr3-1.cdninstagram.com/t50.2886-16/12930587_1020784647992081_252978711_n.mp4"
  muted
  onloadedmetadata="this.muted = true"
  onmouseenter="play()"
  onmouseleave="pause()">

这篇关于无法在Firefox中隐藏HTML5视频标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！