Nếu bạn muốn sticky menu khi cuộn trang trong wordpress hay web html bất kỳ. Chỉ đơn giản là chèn đoạn code sau vào bên trong thẻ </body> và thay đổi thuộc tính bên trong code là xong.
Đoạn code như sau:
/**
code sticky menu - cố định menu khi cuộn trang
*/
<style>
.fixed {
left: 0;
max-width: 100%;
overflow: visible;
position: fixed !important;
top: 0;
width: 100%;
z-index: 1000;
}
</style>
<script>
//Sticky menu
var sticky = document.querySelector('.header-main');
var origOffsetY = sticky.offsetTop;
function onScroll(e) {
window.scrollY >= origOffsetY ? sticky.classList.add('fixed') :
sticky.classList.remove('fixed');
}
document.addEventListener('scroll', onScroll);
</script>
Không cần dùng bất cứ plugin nào và tương thích với mọi theme wordpress. Bạn mở file footer.php của theme đang sử dụng. Tìm đến dòng </body> và dán đoạn code trên vào.
Thay đổi đoạn .header-main thành thẻ class trong div chứa menu của bạn. Lư lại và tận hưởng kết quả nhé.