Search code examples
jqueryaudioscrollmute

mute unmute sound with jQuery on scroll


I want to mute an audio on scrolling and unmute when the scroll is on the top of the page. I have tried many options here but nothing works.

http://codepen.io/chrisgaillard/pen/JbWxWJ

$(window).scroll(function() {
    if ($(this).scrollTop() >1){  
        $('audio').setAttribute('muted'); 
    } else {
        $('audio').setAttribute('unmuted'); 
    }
});

Thank you


Solution

  • You need to use the volume property, not set the muted attribute. Try this:

    $(window).scroll(function() {
        $('audio').prop('volume', $(this).scrollTop() > 1 ? 0 : 1);
    });
    

    Updated Codepen