css jquery sticky navbar foreground

Question

Я пытаюсь добавить клейкий навигатор к своему шаблону opencart «Lexus Extroic». Очень трудно. Мой код:

<script> 
$(document).ready(function() { 
    $(document).scroll(function() { 
     var scroll = $(this).scrollTop(); 
     var topDist = $("#header-layout").position(); 
     if (scroll > topDist.top) { 
      $('nav').css({"position":"fixed","top":"0"}); 
     } else { 
      $('nav').css({"position":"static","top":"auto"}); 
     } 
    }); 
}); 
</script> 

Но результат не очень хороший. Вот результат Страница: http://45.55.74.161/index.php?route=common/home

А вот мой оригинальный шаблон: http://azbay.az

Answer 1

Sticky навигация супер сложно. Вы должны использовать bootstrap (css-библиотеку) и применять класс навигации «navbar-fixed-top», чтобы всегда держать его в верхней части страницы.