Hướng Dẫn Sticky Menu Khi Cuộn Xuống trong NukeViet CMS 4.xmở file layout/header_extended.tpl
tìm
<nav>
<div class="container">
<div class="row">
[MENU_SITE]
</div>
</div>
</nav>
Và thay thế thành đoạn sau
<nav class="second-nav stickymenu" id="menusite"><div class="container"><div class="row"><div class="bg box-shadow wraper">[MENU_SITE]</div></div></div> </nav>
<script type="text/javascript"> $(function() { var sticky_navigation_offset_top = $('.stickymenu').offset().top; var sticky_navigation = function(){ var scroll_top = $(window).scrollTop(); if (scroll_top > sticky_navigation_offset_top) { $('.stickymenu').css({ 'position': 'fixed', 'z-index': 990,'top':0 }); } else { $('.stickymenu').css({ 'position': 'relative', 'width': '100%' }); } }; sticky_navigation(); $(window).scroll(function() { sticky_navigation(); }); }); </script>
vào file default\css\style.css thêm css
.stickymenu { background: red; margin: 0 auto 0; width: 100%; }
tìm
<nav>
<div class="container">
<div class="row">
[MENU_SITE]
</div>
</div>
</nav>
Và thay thế thành đoạn sau
<nav class="second-nav stickymenu" id="menusite"><div class="container"><div class="row"><div class="bg box-shadow wraper">[MENU_SITE]</div></div></div> </nav>
<script type="text/javascript"> $(function() { var sticky_navigation_offset_top = $('.stickymenu').offset().top; var sticky_navigation = function(){ var scroll_top = $(window).scrollTop(); if (scroll_top > sticky_navigation_offset_top) { $('.stickymenu').css({ 'position': 'fixed', 'z-index': 990,'top':0 }); } else { $('.stickymenu').css({ 'position': 'relative', 'width': '100%' }); } }; sticky_navigation(); $(window).scroll(function() { sticky_navigation(); }); }); </script>
vào file default\css\style.css thêm css
.stickymenu { background: red; margin: 0 auto 0; width: 100%; }
NHÀ CUNG CẤP DỊCH VỤ CHUYÊN NGHIỆP
PHÁT TRIỂN
WEBDESIGN - HOSTING - DOMAIN