Home > JavaScript Blogger > Menu Bawah Keluar dan Sembunyi
Demo :
Lihat ke bawah, dan letakkan kursor mouse diatasnya.
Hak Cipta seluruh artikel dan template dilindungi Undang-Undang. Plagiat artikel tanpa mencantumkan sumber atau menghapus nama template yang saya buat, saya tidak segan-segan menegur atau memposting Link Blog tersebut secara permanen.
Stop Plagiarism Didukung oleh Creative Commons - Google - Yahoo - Weblogs - Blogger
Cara membuatnya
Dari Dashboard >> Design >> Edit HTML.
Langkah pertama > Penempatan kode CSS
dibawah <b:skin><![CDATA[
........
diatas ]]></b:skin>
.expstickybar{
position:fixed;
color: white;
padding: 5px;
right:0;
left:0;
visibility:hidden;
background: #e43a3d;
z-index: 10000;
width:auto;
font-weight:bold;
}
.expstickybar a{
color: white;
}
Langkah kedua > Penempatan URL JavaScript
dibawah ]]></b:skin>
........
diatas </head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://pagenano.googlecode.com/files/Menu%20Bawah.js"></script>
Teks berwarna merah, jika sudah ada tidak perlu lagi !.
Penempatan
dibawah <body>
........
diatas </body>
<div id="stickybar" class="expstickybar">
<a href="#togglebar"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-vL0eGzFh84S5uPeAZY2E8nO0wxpriCuC74Z6_2gp4O19Fft-siV4fzj4uc3xuHvMBhdhKaS_Ky5oQmsNc2GCAj-IjRAX1mzf-rzBXAfsF1K_i9yKw8z43zFVRYNRPGaP-hxsA0pZzqXr/s1600/Nano+Yulianto+-+open.gif" data-closeimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgV6MI8OCNQPuej9WEPCOdwgsMmwQYibgr9VpaX76gbQmaUxTJ2LvhINw-ERC6f8LiqiSp-Da6ptBUJJ4ZnaPjp2ymhF-GPdM0zEDso4pRSzqOILvuTTW_JNaQhYb08JE0jw7drj5v4rkqB/s1600/Nano+Yulianto+-+close.gif" data-openimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-vL0eGzFh84S5uPeAZY2E8nO0wxpriCuC74Z6_2gp4O19Fft-siV4fzj4uc3xuHvMBhdhKaS_Ky5oQmsNc2GCAj-IjRAX1mzf-rzBXAfsF1K_i9yKw8z43zFVRYNRPGaP-hxsA0pZzqXr/s1600/Nano+Yulianto+-+open.gif" style="border-width:0; float:right;" /></a>
<div style="text-align:center;padding-top:3px">Copyright © 2010-2011 <a href='/'>Nama Blog Anda</a></div>
Isi sesuai keinginan anda. Bisa di isi dengan teks atau dengan menu berkolom-kolom.
</div>
Credit : Dynamic Drive
Alhamdulillah
