Menu Header adalah (Navigasion Menu) yaitu menu yang biasa dibuat para blogger untuk menu tentang kategori apa saja yang disediakan di blog itu sendiri. Menu Header ini sangat penting bagi pengunjung agar mereka bisa leluasa berselancar (Surfing) dan membaca blog kita lebih lama. Untuk Menu Header ketika pengunjung sedang membaca mereka membacakan otomatis membaca sampai kebawah, berarti pengunjung scroll down kan. Saya ingin menu header tersebut juga ikut kebawah, jika kalian penasaran caranya bagaimana.
Cara Pertama : 1. Buka Blogger - Kemudian login.
2. Dashboard - Template.
3. Edit HTML.
Proses Pembuatan :
1. Temukan <CTRL+F> kode </body>
2. Copy Dan paste kode Java Script berikut ini, dan letakkan diatas kode </body>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
var stickyNavTop = $('#nav').offset().top;
var stickyNav = function(){
var scrollTop = $(window).scrollTop();
if (scrollTop > stickyNavTop) {
$('#nav').css({ 'position': 'fixed', 'top':0, 'z-index':9999 });
} else {
$('#nav').css({ 'position': 'relative' });
}
};
stickyNav();
$(window).scroll(function() {
stickyNav();
});
});
//]]>
</script>
3. Perhatikan ID CLASS pada tulisan yang berwarna biru. Silakan ganti kode tersebut dengan kode Menu yang ada di Template anda. Biasanya .nav atau #nav atau #menu
4. Sehingga menjadi Seperti ini <Saya Menggunakan ID Class #menu>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
var stickyNavTop = $('#menu').offset().top;
var stickyNav = function(){
var scrollTop = $(window).scrollTop();
if (scrollTop > stickyNavTop) {
$('#menu').css({ 'position': 'fixed', 'top':0, 'z-index':9999 });
} else {
$('#menu').css({ 'position': 'relative' });
}
};
stickyNav();
$(window).scroll(function() {
stickyNav();
});
});
//]]>
</script>
5. Simpan Template!.
Posting Komentar