Search code examples
jquerycssalloy-ui

Add class when scroll down with AlloyUI


I need to add a class when the user scroll down. I usually do this with jQuery:

$(window).scroll(function() {
  var scroll = $(window).scrollTop();
  if (scroll >= 10) {
    $(".dockbar").addClass("dockbar-opacity");
  }
});

How can I do the same thing with AlloyUI? Really thanks.


Solution

  • Using the ScrollInfo plugin and its scroll event

    var body = Y.one('body');
    
    body.plug(Y.Plugin.ScrollInfo);
    
    body.scrollInfo.on('scroll', function (e) {
        if (e.scrollTop >= 10){
           Y.one('.dockbar').addClass('dockbar-opacity');
        }
    });