Layerslider custom mute button on video

Yes i also tried it in a textblock. I put a dummy video in it to get it to work. In de private section there is a login so you guys can check it out.

• This reply was modified 9 years, 1 month ago by vonwelzen.

They also send me this. I tried to copy past the exact code snippet in the callback function but i still can’t get it to work.

You can mute your video by default with the ‘muted’ attribute:

Using jQuery’s .on() method should look like this:

$(document).on(‘click’, ‘.mute-video’, function (){
if ($(“video”).prop(‘muted’)) {
$(“video”).prop(‘muted’, false);
$(this).addClass(‘unmute-video’);

} else {
$(“video”).prop(‘muted’, true);
$(this).removeClass(‘unmute-video’);
}
console.log($(“video”).prop(‘muted’))
});

Please note that WordPress uses jQuery’s .noConflict() mode, so you might need to use the ‘jQuery’ keyword instead of the dollar ($) sign.

You can place the above JavaScript code wherever you want to add it, or leave it in the cbInit callback. Using the .on() method will ensure that the event handler will execute even if videos added/removed later. Due to this behavior you might want to use a more specific selector instead of just $(‘video’). For example $(‘.ls-slide video’) will find only the videos inside a slider.

This is the answer: for anyone who has the problem as well:

function(element) {
jQuery(document).on(‘click’, ‘.mute-video’, function (){
if (jQuery(“video”).prop(‘muted’)) {
jQuery(“video”).prop(‘muted’, false);
jQuery(this).addClass(‘unmute-video’);

} else {
jQuery(“video”).prop(‘muted’, true);
jQuery(this).removeClass(‘unmute-video’);
}
});
}