Video mute/unmute with jQuery

Question

I'd like to make a mute/unmute button in jQuery. I've done some searching on Stackoverflow and this is what I managed to do so far:

$("video").prop('muted', true);

$("#mute-video").click( function (){
    if( $("video").prop('muted', true) )
    {
        $("video").prop('muted', false);
    }

    else {
    $("video").prop('muted', true);
    }

});

but for some reason it's only able to unmute, not to mute back.

Any idea what's wrong with the code?

Code seems ok to me, have you checked if there is any errors in console — dreamweiver, Feb 18 '14 at 11:33
If you want to unmute your video: `$("video").prop('muted', false);` — Avatar, Dec 23 '21 at 14:42

Ronny · Accepted Answer · 2014-02-18T11:39:58.977

42

When you're doing if( $("video").prop('muted', true) ) you're both setting the property to true and then ask if it's true.

Changing the condition to if( $("video").prop('muted') ) solves the problem - Here's an example.

Also note this will work on all videos on a page so if you have more than one player it might get confusing.

edited Feb 18 '14 at 11:39

answered Feb 18 '14 at 11:33

Ronny

4,295
2
24
30

1

Ronny, big thnx, that worked! If it comes to "video", I used it as a temporary solution - now I checked with the video ID and it works as well. – oneday Feb 18 '14 at 11:43
4

I came across this post and shortened the code: `$("video").prop('muted', !$("video").prop('muted')))` – pasql Jun 01 '16 at 15:52

Video mute/unmute with jQuery

1 Answers1

Linked