Wednesday, September 17, 2014

Cara Membuat Menu Tetap di atas Halaman Ketika di Scroll kebawah / Blogger



Cara Membuat Menu Tetap di atas Halaman Ketika di Scroll kebawah / Blogger


1. Sign Blogger
2. Klik Template
3. Klik edit HTML
4. Expand template. mana tau ada kesalahan bisa di ulang kembali
5. Cari kode ]]></b:skin>kemudian copy dan pastekan semua code di bawah ini tepat di atas kode ]]></b:skin>

#menu {
      position:fixed;
      top:0;
      left:0;
      width:100%;
      height:60px;
      z-index:100;
      margin-bottom:3px;
      padding:5px;
      background-color:#efefef;
      font-size:20px;
      text-align:left; 
}
nav ul ul {
display: none;
}

nav ul li:hover > ul {
display: block;
}
nav ul {
background: #efefef;
padding: 0px;
list-style: none;
position: relative;
display: inline-table;
}
nav ul:after {
content: ""; clear: both; display: block;
}
nav ul li {
float: left;
}
nav ul li:hover {
background: #4b545f;
}
nav ul li:hover a {
color: #fff;
}

nav ul li a {
display: block; padding: 10px 40px;
color: #757575; text-decoration: none;
}
nav ul ul {
background: #5f6975; border-radius: 0px; padding: 0;
position: absolute; top: 100%;
}
nav ul ul li {
float: none;
border-top: 1px solid #6b727c;
border-bottom: 1px solid #575f6a;
position: relative;
}
nav ul ul li a {
padding: 15px 40px;
color: #fff;
}
nav ul ul li a:hover {
background: #4b545f;
}

nav ul ul ul {
position: absolute; left: 100%; top:0;
}

6. Setelah itu cari kode </header> atau tekan ctrl+f biar gampang mencarinya.
7. copy paste kode dibawah ini tepat diatas </header>

<div id="menu" >
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Artikel</a>
<ul>
<li><a href="#">Blogger</a></li>
<li><a href="#">Photoshop</a></li>
<li><a href="#">Web Design</a>
<ul>
<li><a href="#">HTML</a></li>
<li><a href="#">CSS</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Profile</a></li>
</ul>
</nav>
</div>

8. Isi tanda # dengan alamat yang ingin kalian tampilkan ketika menu di klik
9. Kemudian klik simpan.

Selamat mencoba !!!
 

Bagikan

Jangan lewatkan

Cara Membuat Menu Tetap di atas Halaman Ketika di Scroll kebawah / Blogger
4/ 5
Oleh

Subscribe via email

Suka dengan artikel di atas? Tambahkan email Anda untuk berlangganan.

Terimakasih telah memberi komentar di sonirivaldi.blogspot.com

loading...