Answers for "how to sticky header in css"

CSS
4

sticky header css

nav {
    position: sticky; top: 0;
}
Posted by: Guest on September-19-2021
7

stick menu bar in css

.navigation {
   /* fixed keyword is fine too */
   position: sticky;
   top: 0;
   z-index: 100;
   /* z-index works pretty much like a layer:
   the higher the z-index value, the greater
   it will allow the navigation tag to stay on top
   of other tags */
}
Posted by: Guest on July-30-2020
0

sticky header on scroll

*****************HTML****************

<div class="sticky"></div>


*****************CSS****************

.fixed {
    position: fixed;
    top:0; left:0;
    width: 100%; }
    
    
******************jQuery***************

$(window).scroll(function(){
  var sticky = $('.sticky'),
      scroll = $(window).scrollTop();

  if (scroll >= 100) sticky.addClass('fixed');
  else sticky.removeClass('fixed');
});
Posted by: Guest on September-07-2021

Browse Popular Code Answers by Language