Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to unmute html5 video with a muted prop

I've created a simple video block with muted (for mobile autostart) but now i can not change the mute state...

I used that repository , fiddle link would be great.

So far i've tried this with no luck.

HTML

<video width="640" height="264" muted autoplay webkit-playsinline src="'+videoURL+'"></video>'

JS

$(document).on("click",".containerVolume",function(e){
        if(isMuted){
            $('video').prop('muted', false);
        }
        else{
            $('video').prop('muted',true);
        }
});

var videos = document.querySelectorAll('video');
      if (location.search === '?enabled=false') 
      {
      } else if (location.search === '?enabled=true') {
           enableVideos(false);
      } else {
         enableVideos();
      }
      function enableVideos(everywhere) {
          for (var i = 0; i < videos.length; i++) {
             window.makeVideoPlayableInline(videos[i], !videos[i].hasAttribute('muted'), !everywhere);
          }
      }
like image 989
Özgür Ersil Avatar asked Aug 19 '16 14:08

Özgür Ersil


People also ask

How do you mute and unmute a video in HTML?

Here in this program, we have used the default video element of HTML 5 assigned with a source code of our video and used a muted attribute, which will add a small mute icon below the video screen with other control options. We can easily use the mute icon to switch between mute and unmute options.

How do you unmute a video?

Via the Scene Screen Swipe right or left to find the video clip you would like to change the audio options for. 3. Tap on the 3 dots below the video clip and tap on “Mute” or “Unmute” in the dropdown menu.

How do you add a muted video in HTML?

Video Tag is new to HTML5. Users can use muted attributes in video tags to mute a video. The muted attribute is a boolean attribute.

Why video is not playing in HTML5?

For playing the videos on web browsers, there is a new type of video element designed that is HTML5. If you see the message “HTML5 video not found” while playing a video on a web page, it means your browser doesn't support the HTML5 format codecs or missed some video codecs.


2 Answers

Try this:

function toggleMute() {

  var video=document.getElementById("myVideo");

  video.muted = !video.muted;

}

Check example here

If your own code is not working, try adding an id to your video/element you want the click to register on and using:

var video=document.getElementById("myVideo") ;   

$(video).on("click", function(e){
  video.muted = !video.muted;
});
like image 53
Glen Despaux Jr Avatar answered Sep 20 '22 21:09

Glen Despaux Jr


You could simply mute/unmute with

document.getElementById("theIdOfYourVideoGoesHere").volume=0;

and

document.getElementById("theIdOfYourVideoGoesHere").volume=1;

(This thread appears to be two years old but today it was the number one top result in my google search)


Bilgisayar ne bilgiden anlar ne saygıdan. Çünkü o cansız bir düzenektir. O kadar.

like image 44
B.A.B. Avatar answered Sep 20 '22 21:09

B.A.B.