Mungkin anda sudah paham dengan Judul postingan saya kali ini Cara Membuat Buku Tamu Blog Tanpa Di Klik atau yang artinya pada saat kursor kita lewat baru membuka sendiri dengan otomatis. Beda hal nya dengan cara membuat buku tamu yang telah saya posting pada postingan saya yang lalu yang berjudul Cara Pasang Buku Tamu / Chat Box
Maka di postingan saya kali ini hanya menambahkan saja, sebagai contoh Cara Membuat Buku Tamu Blog Tanpa Di Klik Terbuka. Baiklah langsung saja daripada lama2 kita mulai caranya sebagai beriku:t
- Login Ke Akun Blog Anda
- Pilih Rancangan/Tata Letak
- Pilih Tambah Gadget
- Kemudian Add Gadget
- Dan Pilih HTML/JavaScript
- Salin Script / kode Di bawah dan Masukan ke dalam isian HTML/JavaScript.
<style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}
.gbtab{
height:150px;
width:50px;
float:left;
background:url('http://i1042.photobucket.com/albums/b429/Farix_2010/Chatting.png') no-repeat;
}
.gbcontent {
float:left;
border:1px solid #BB0000;
-moz-border-radius-bottomleft:10px;
-webkit-border-radius-bottomleft:10px;
-o-border-radius-bottomleft:10px;
-khtml-border-radius-bottomleft:10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-topleft: 10px;
background: #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx2MkqI5BHQn5nzcMWUtbgvApInxv4o4jZwV991ttk8T-X2Wpb-9peZ3KKzF7fxme6oj7VZWC1PtCnbPdO_-rNU1dwaepQqPEp0J8KanFT0ucubdT4JslKWO6bac8hTwlXC8fBRT9qGAY1/s1600/api.gif) no-repeat bottom;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 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+")", 5);}
}</script>
<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>
<div class="gbcontent">
<center>
Letakan Script Buku tamu kamu Disini
<br />
<div style="text-align:center">
<a onclick="showHideGB()" class="tips-fade" title="klik untuk tutup">
<center><hr /><img src="http://i1042.photobucket.com/albums/b429/Farix_2010/CloseComment-1.png" /><hr /></center>
</a>
</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script></div>
Kemudian simpan / Save dan lihat hasil nya.
Keterangan:
Teks yang saya beri tanda Warna Merah dan Biru, silahkan ganti dengan script / kode buku tamu kamu, Kemudian teks yang sudah saya tandai dengan Warna Merah adalah gambar2nya. Penjelasannya, Yang warna Merah Biru Muda adalah yang biasa berfungis untuk tombol, tapi karena scriptnya otomatis membuka sendiri jadi berfungsi jika kursor melewati tombol itu, Kemudian yang berwarna Merah Hijau Muda adalah backgroundnya coba lihat punya saya kalau belum jelas tidak ada backgroundnya (tembus pandang). Dan yang terakhir adalah Warna Merah Kuning Tua adalah gambar untuk klik tutup. Yang sudah saya beri warna Hijau adalah warna dari Garis Tepi dan pada background. Dan terakhir yang sudah saya beri warna Kuning Muda adalah komentar atau tulisan penjelas yang jika muncul ketika kursor kita menunjuk itu. Semua yang sudah saya beri warna adalah bisa anda ganti sesuai selera anda.Mungkin hanya itu saja info dari saya mengenai Cara Membuat Buku Tamu Blog Tanpa Di Klik Terbuka semoga di lain kesempatan akan ada cara lain lagi mengenai Buku tamu.
Tags : 
