Fixed nav menu on top when page scroll

Goat

22 May 2014 Author

Make a CSS class into your css file (example .fixed) with at least this 2 following rules:

 .fixed { position: fixed; top:0; }

add following jQuery snippet to your head to trigger your .menu nav (jQuery lib is required of course!)

 $(window).bind('scroll', function() {
         if ($(window).scrollTop() > 50) {
             $('.menu').addClass('fixed');
         }
         else {
             $('.menu').removeClass('fixed');
         }
    });

Enjoy!

CSS3, jQuery

Comments are closed.