Custom button to unmute Vimeo embed

Design help Custom code
1

Hi, is it possible to have a button that unmute Vimeo embed video like this site:

Thank you!

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Yes this is possible throught custom code add the following custom code and set video on position absolute. and set muted button position relative and set its z-index: 100 and set video z-index: 0;

<video class="video" autoplay loop>
    <source src="video.mp4" type="video/mp4">
</video>
<button class="mute-video unmute-video"></button>
3 
$("video").prop('muted', true);

$(".mute-video").click(function () {
    if ($("video").prop('muted')) {
        $("video").prop('muted', false);
        $(this).addClass('unmute-video'); // changing icon for button

    } else {
        $("video").prop('muted', true);
        $(this).removeClass('unmute-video'); // changing icon for button
    }
    console.log($("video").prop('muted'))
});
1 Like
4

Add this in script tag

5

Does this also work with Vimeo embed? My client’s video is hosted on Vimeo.

Thank you

6

yes

add video link inside src=""
1 Like
7

Thank you so much @Moheen, it works perfectly!

8

Hey @Ludens_Tran any chance you can share your Webflow read-only link? I’m trying to accomplish the same thing you did in the homepage video.