jQuery: Detect 'classes' changes on an element while scrolling down the page

Question

I am looking for a way to detect changes on the classes of a header element, that are been applied during scrolling down from another script.

So, when a specific class is applied on the header, I want to run my function on another element.

So something like (if that makes any sense):

$('html').scroll(function(){ // So while scrolling down the page
    // if header gets the class
    if (('#header').hasClass('header-scrolled')) {
        alert('ops'); 
    }
})

I am not sure on how to approach this. Any guidance would be appreciated.

Answer 1

You can listen to scroll event on window element:

$(window).on('scroll', function() {
   //Check classes
});