Cara Membuat Menu Melayang - Saat di scroll menu di atas akan mengikuti ke bawah, jadi si pembaca tidak perlu melihat isi menu anda ke atas lagi. mudah bukan? Script ini saya ambilo dari kang ismet. ini cara memasangnya. Simpan kode ini di atas </body> dan tentukan selectornya (pada script dibawah saya aplikasikan pada #header-wrapper). kalau masih bingung cara memasangnya? cari dulu nama menu yang ingin dijadikan melayang, setelah itu cari kode CSS nya, dan ganti kode yang merah di bawah dengan kode css menu anda.
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
// Menentukan elemen yang dijadikan sticky yaitu #header-wrapper
var stickyNavTop = $('#header-wrapper').offset().top;
var stickyNav = function(){
var scrollTop = $(window).scrollTop();
// Kondisi jika discroll maka menu akan selalu diatas, dan sebaliknya
if (scrollTop > stickyNavTop) {
$('#header-wrapper').css({ 'position': 'fixed', 'top':0, 'z-index':9999 });
} else {
$('#header-wrapper').css({ 'position': 'relative' });
}
};
// Jalankan fungsi
stickyNav();
$(window).scroll(function() {
stickyNav();
});
});
//]]>
</script>
Sekian tutorial tentang Cara Membuat Menu Melayang, semoga bisa bermanfaat untuk anda. terimakasih
baca juga cara membuat template seo.