I have a web page while I scroll page from top to button then I want to fixed menu bar on the top position. I am use some css code but it not work properly. I need help to do this.
I am trying this CSS code:
<style type="text/css"> .header-nav{ position: fixed; top: 0px; left: 0px; right: 0px; } </style>
You need to use some JS and CSS code for do it. Use this example code, it work when you page scroll from top.
SJ code:
<script type="text/javascript"> $(window).bind('scroll', function () { if ($(window).scrollTop() > 150) { $('.header-nav').addClass('fixed-header-nav'); } else { $('.header-nav').removeClass('fixed-header-nav'); } }); </script>
CSS code:
<style type="text/css"> .fixed-header-nav{ position: fixed; top: 0px; left: 0px; right: 0px; z-index: 100; } </style>
Question and answer is powered by AnsPress.io