Title : Hidden Navbar Blogger Use Simple JavaScript
link : Hidden Navbar Blogger Use Simple JavaScript
Hidden Navbar Blogger Use Simple JavaScript
Sebelumnya story of menghias navbar blogger ternyata cukup mendapat respon. Maka dari itu kelanjutannya harus diberi sentuhan² seni agar sedikit full stylish ;)) Ide kreasi, Koben dapatkan dari blog kepunyaan master Roxx \m/ Sepertinya dia sedang enjoy ngulik² and membuattemplate. Komentar malah promosi =))
Hasil kerja dari hack trick sekarang, yaitu menyembunyikan navbar blogger dengan teknik menutupi navbar dengan background. Dibubuhi sedikit ramuan JavaScript, tidak lain untuk membuka si background agar terlihat kembali itu si navbarnya :D Begitu kira² penjelasan yg tidak menjelaskan :P Singkat cerita mirip dengan trick berikut on off navbar! Tapi saat ini, cuman membuka saja, enggak bisa menutup lagi :D Lumayan untuk gaya-gayaan b-)
Langkah pertama silahkan lakukan #navbar-iframe {
Setelah itu tepat dibawahnya tambahkan CSS coded bumbu
display: block;
}
#hidden_navbar {
background-color: #333;
position: absolute;
top: 0;
right: 0;
height: 30px;
width: 100%;
}
#hidden_navbar img {
float: right;
margin-right: 7px;
margin-top: 7px;
cursor: pointer;
}
Kode CSS keseluruhan#navbar-iframe {
display: block;
}
#hidden_navbar {
position: absolute;
top: 0;
right: 0;
height: 30px;
width: 100%;
}
#hidden_navbar img {
float: right;
margin-right: 7px;
margin-top: 7px;
cursor: pointer;
}
Temuin kode
<div id='hidden_navbar'><img onClick='closeNavbar();return false;' src='http://2.bp.blogspot.com/-PBFoNGJ02b4/TihkiNYR9_I/AAAAAAAABEs/Iy8GGRhULjs/s1600/navbar.png' alt='open' title='show navbar'/></div>
<script>//<![CDATA[
function closeNavbar() {
document.getElementById("hidden_navbar").style.visibility = "hidden"
};
//]]></script>
SAVE. Lihat hasil kerja :)Itu bumbu untuk navbar default bawaan blogger, dengan panjang full monitor. Sekarang bagaimana jika tampilan template seperti Beben Koben si bloglang anu ganteng kalem tea, yang mana konten berada di tengah² monitor! Beda dikit pada ramuan CSS-nya doang kok sob ;)
Untuk konten template center/tengah maka kode css ganti dengan yang berikut. Bumbu lainnya mah sama!
#navbar-iframe {
width: 950px ;
margin: 0 auto;
display: block;
}
#hidden_navbar {
background-color: #333;
position: absolute;
top: 0;
right: 0;
left: 0;
width: 950px;
height: 30px;
margin: auto;
}
#hidden_navbar img {
float: right;
margin-right: 7px;
margin-top: 7px;
cursor: pointer;
}
Aturlah Eh kelupaan,
Happy navbar \m/
Thus articles Hidden Navbar Blogger Use Simple JavaScript
that is all articles Hidden Navbar Blogger Use Simple JavaScript This time, hopefully can provide benefits to all of you. Okay, see you in another article posting.
You now read the article Hidden Navbar Blogger Use Simple JavaScript with the link address https://autopostingblogspot.blogspot.com/2012/03/hidden-navbar-blogger-use-simple.html
0 Response to "Hidden Navbar Blogger Use Simple JavaScript"
Posting Komentar