textmutevelo

How to make text mute/unmute a video in Corvid?


On my website, I have three pages with videos that auto play. When these videos auto play, they are muted. I enjoy the minimalist design, so I don't want any of the video controls visible. Here is an example of one of the pages: https://www.notenoughknife.com/jamstudios

As you can see, below the video is text which reads "mute/unmute" - of course, I would like to edit the code for the text, allowing the user to mute and unmute the video. I am using Wix.com, which uses Corvid to edit page code. I have edited with this before, adding "show more/show less" buttons, so I am somewhat familiar.

I have found the code online to either mute or unmute the video, but I can't for the life of me figure out how to make it do both. Here is the unmute code:

export function text42_click(event) {
    $w("#videoPlayer1").unmute();
}

And here is the mute code:

$w("#videoPlayer1").mute();

Solution

  • There is also a isMuted property you can use to toggle the functionality of the text click. It would look something like this:

    export function text42_click(event) {
        if($w("#videoPlayer1").isMuted) {
            $w("#videoPlayer1").unmute();
        } else {
            $w("#videoPlayer1").mute();
        }
    }