Senin, 30 Mei 2011

CARA MEMBUAT BUKA TAMU BUKA-TUTUP DI BLOG




Langsung aja yaa....kali ini kita akan mempraktekkan trik and tips bagaimana cara membuat buku tamu pada blog kita.....caranya pun tidak terlalu sulit alias gampang banget....
Okey sobat.......kita langsung aja ke proses pembuatannya..Ikuti aja langkah di bawah ini.........!!!
 








 Langkah pertama


Silahkan anda meng COPY Script Kode Dibawah Ini :

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgRXpcKo1QzQCqXPzbZtq-BDnJ7iuszfnwhdGf2sX9eGWi8VMQpd4u-lKzI17n3zJWZkCCujwQblsx-xktL2tQYW9CbjRz8fGonfahkIkadsq1xwwoFtEBe21nDVweGPT5l5bYXi6FEuPA/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">




<br/>
Mau punya buku tamu seperti ini?<br/>
Klik di
<a href="http://bangjoen.blogspot.com/2010/05/membuat-buku-tamu-buka-tutup-di-samping.html">
sini
</a>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

----------------------------------------------------------

Langkah Kedua

1. Silahkan Login ke blogger dengan ID anda
2. Kemudian silahkan Klik menu tata Letak
3. Lalu Klik Elemen Halaman
4. Kemudian Klik Tambah Gadged
5. Kemudian cari dan Klik lagi HTML/JavaScript
6. Lalu Copy Scripi kode diatas dan paste kan kodenya dalam kotak HMTL/JavaScript
7. Dan untuk melihat hasilnya ...KLIK saja PRATINJAU  laluSetelah itu klik Simpan
8. Dan Lihat Hasilnya
MUDAH khan.......Kalau gitu selamat mencoba sobat.....
Salam BloGGer..................
Semoga Sukses….!!

0 komentar:

Posting Komentar

 

WASPADA NUSANTARA