Hidden Navbar Blogger Use Simple JavaScript

Hidden Navbar Blogger Use Simple JavaScript - Hallo friend Cara Mudah Posting Gratisan, In the article you read this time with the title Hidden Navbar Blogger Use Simple JavaScript, we have prepared well for this article you read and download the information therein. hopefully fill posts Article Blogger, Article Coded, Article CSS, Article Hack, Article HTML, Article Trik dan Tips, we write this you can understand. Well, happy reading.

Title : Hidden Navbar Blogger Use Simple JavaScript
link : Hidden Navbar Blogger Use Simple JavaScript

Also Read


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 membuat template. 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 backup full template. Kemudian tekan Ctrl + F pada keyboard, temukan kode #navbar-iframe Gantikan variabel CSS yang ada dengan yang ini#navbar-iframe {
display: block;
}
Setelah itu tepat dibawahnya tambahkan CSS coded bumbu

#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 {
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;
}


Temuin kode </body> tepat diatas/sebelum letakin aji² berikut<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 panjang/width sesuai dengan kebutuhan. Begitu saja kira² postingan kali ini :)
Eh kelupaan, background-color: #333; bisa kalian fariasikan menjadi gambar. Tapi harus bisa kode²nya ya :))
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