Hướng dẫn tạo menu cố định trên đầu trang khi cuộn trang web

Bình thường menu website sẽ mất khi cuộn trang web xuống phía dưới, nếu muốn khi cuộn trang web xuống mà vẫn giữ menu trên top thì các bạn có thể thêm 1 đoạn code như sau.
Demo:

Demo menu cố định trên đầu trang khi cuộn trang web - Sticky menu

Video Demo:

Cách làm:

CSS:

<style type="text/css">
#navigation { height:50px; width:100%; max-width:1080px; position:relative; display:block; background:transparent; }
#navigation.fixed { position:fixed; top:-4px; z-index:9999; }
</style>

JAVACRIPT (Trong thẻ body)

<script>function handleScroll(){if(window.XMLHttpRequest){var offset=window.pageYOffset?window.pageYOffset:document.documentElement.scrollTop;document.getElementById(&#39;navigation&#39;).className=(offset&gt;104?&#39;fixed&#39;:&#39;&#39;)}}if(window.addEventListener){window.addEventListener(&#39;scroll&#39;,handleScroll,false)}else{window.attachEvent(&#39;onscroll&#39;,handleScroll)}    </script>

CODE <div id='navigation'> nội dung menu của bạn </div> Chú ý: Bạn có thể điều chỉnh chiều rộng menu max-width:1080px thành chiều rộng tương ứng trong site của bạn và chiều cao tương ứng top:-4px trong site của bạn
Chúc bạn thành công