Home » , , , , , » Membuat Menu Blog Tetap Muncul Saat Discoll pada Halaman

Membuat Menu Blog Tetap Muncul Saat Discoll pada Halaman

Cara Buat agar Menu utama Blog Tetap Muncul disaat halaman Discoll

Menu merupakan selalu ada disetiap blog sesuai isi dari blog tersebut dan selalu mempunyai menu utama yang biasanya terdapat paling atas halaman atau didaerah header dan berisi menu home.

Pada tutorial ini, AzaSkom  memberikan cara bagaimana agar menu navigasi blog tetap muncul, karena Azaskom sering melihat blog dimana menunya tetap ada saat halaman discroll.

Ini dia Cara Buat agar Menu utama Blog Tetap Muncul disaat halaman Discoll;
  1. Buka bagian Template – Edit HTML,
  2. Cari kode </body> dengan cara CTRL+F,
  3. Copy kode dibawah ini, dan Paste di atas kode </body> Template,
<!--Menu tetap muncul saat di scroll!-->
<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>

Sesuaikan jenis nama menu yang terdapat di template, biasanya menggunakan .nav atau #menu, rubahlah nama menu yang ditandai warna merah sesuai jenis menu di setiap template.

Hasilnya bisa dilihat diblog AzaSkom ini.

Sekian Tutorial dari Membuat Menu Blog Tetap Muncul Saat Discoll pada Halaman.


Jika ada yang ingin bertanya atau saran, silakan tinggalkan komentar. Terimaksih telah berkunjung di blog Azaskom.


AzaSkom
AzaSkom Updated at: 23:06

0 komentar:

Post a Comment

Silakan berikan komentar atau pertanyaan secara sopan....