2

There is the code I use in order to change the css of my sticky header when a user start scrolling.

I would like to keep it like that but I'm looking to change my sticky header back to its original css class (#header_container) when the user reaches the bottom of the page too.

$(window).on("scroll touchmove", function () {
    $('#header_container').toggleClass('tiny', $(document).scrollTop() > 0); 
});

Sorry I'm not good at this.

Hope you can help ! Thank you!

technophobia
  • 2,644
  • 1
  • 20
  • 29
imromains
  • 99
  • 9

1 Answers1

1

Try:

$(window).on("scroll touchmove",function() {
   if($(window).scrollTop() + $(window).height() == $(document).height() || $(window).scrollTop() == 0 ) {
       $('#header_container').removeClass('tiny');
   } else {
$('#header_container').addClass('tiny');   
}
});

jsfiddle: http://jsfiddle.net/jsz8wumm/1/

madalinivascu
  • 32,064
  • 4
  • 39
  • 55