Kali ini Twenty4rt (US. Marschal) ~ Blog akan berbagi sedikit ilmu (hahahaha) tentang cara memasang widget Auto Hide Cbox atau bisa dibilang sebagai Buku Tamu..
Oke, tanpa basa-basi lagi langsung aja Ke ˜*•.˜"*°•.˜"*° • Te-Ka-Pe •°*"˜.•°*"˜ .•*˜Jika sahabat belum tahu fungsi dari layanan CBox ini saya kasih tahu deh.. hehehe
CBox merupakan layanan jasa chatting. Tapi jika kamu belum mempunyai script dari CBox maka kamu harus daftar dulu di situs resmi-nya silahkan cek di http://www.cbox.ws/ .
Ok, Langsung aja kita coba praktekan.
1. Login dulu di blogger sobat,, (hehehe ya iyalah masa login ke facebook)
2. pilih rancangan -> tambah gadget
3. pilih yang html/java script
4. pastekan kode dibawah ini
<style type="text/css">
#gb{
position:fixed;
top:40px;
z-index:+1000;
}* html #gb{position:relative;}
.gbtab{
height:150px;
width:50px;
float:left;
background:url('http://img22.imageshack.us/img22/8941/tabs2.gif') 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/AVvXsEhowGWrGd9tNRLfSiVWJejYjbeIgjyO-ypHrLz8rqEZ22s3UfiQx6_L9WVAJhYvJNIOMLmgjOnrqe4WZnzrBjY33n2onycVplplyKhkgxHUIfeSVjtMvwgZO2NDoBY3LsngW-YeK2JiLswu/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>
Pastekan kode cbox kamu disini
<br />
<div style="text-align:center">
<a onclick="showHideGB()" class="tips-fade" title="klik untuk tutup chattingbox">
<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>
NB : Ganti Script yang berwarna merah dengan script CBox Sahabat.
5. Simpan dan lihat hasilnya
Selamat Mencoba yaaa SAHABAT. "Good Luck" !!
