Home » » Navigasi di bawah header

Navigasi di bawah header

Posted by CB Blogger

Sobat mau memperindah tampilan blog dengan membuat navigasi di bawah header seperti contoh di bawah ini lihat demonya disini




Sebelumnya sobat cari kode <head> tag HTML, tambahkan kode berikut

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/interface.js"></script>

<link href="style.css" rel="stylesheet" type="text/css" />

<!--[if lt IE 7]>
<style type="text/css">
.dock img { behavior: url(iepngfix.htc) }
</style>
<![endif]รข��>

Bagian pertama adalah Javascript, bagian kedua adalah CSS stylesheet, dan terakhir adalah bagian PNG hack for IE 6.

Jangan lupa untuk menambahkan kode berikut ke mana saja dalam <body> tag:

<script type="text/javascript">
$(document).ready(
function()
{
$('#dock2').Fisheye(
{
maxWidth: 60,
items: 'a',
itemsText: 'span',
container: '.dock-container2',
itemWidth: 40,
proximity: 80,
alignment : 'left',
valign: 'bottom',
halign : 'center'
}
)
}
);
</script>

Untuk menambahkan item menu ke atas (catatan: tag div setelah tag img):

<a class="dock-item" href="#"><img src="images/home.png" alt="home" /><span>Home</span></a>

Untuk menambahkan item menu ke bawah (catatan: p tag adalah sebelum img tag):

<a class="dock-item2" href="#"><span>Home</span><img src="images/home.png" alt="home" /></a>

Selesai dan jangan lupa seperti biasa sebelum mengutak atik template sobat , simpan dulu template sobat di notepad atau pada tab html yang ada tulisan Download template lengkap
atau kalau belum jelas penjelasan di atas silahkan sobat kunjungi langsung situsnya di sini


6 comments:

  1. mantapsss euy....navigasi. biar mudah di obok-obok blognya

    ReplyDelete
  2. mantab mantab mantab,,
    baik nieh
    izin tuk di serap ilmunya.

    Navigasi di bawah header

    ReplyDelete

Thanks dah berkunjung dan berbaik hati memberikan komentarnya.. dan jangan bikin namenya dengan ANONYMOUS karana oppie akan berkunjung balik sekedar mencari persahabatan .... ops jangan spam yah kalau spam saya delet thanks