15 March 2012

membuat chatbox berada di samping blog

Cara membuatnya sobat bisa mengikuti langkah-langkah sederhana berikut :

1. Sobat harus memiliki code chatbox  terlebih dahulu, untuk mendaftar cbox klik di sini.

2. Sobat login ke dashboard blogger.com --> Rancangan --> add gadget --> pilih yang 'HTML/JavaScript'

3. Copy Code berikut :

* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i683.photobucket.com/albums/vv193/vebyo/Guest3.gif') 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">
PASANG SCRIPT CHATBOX SOBAT DISINI
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>

Keterangan :
Sobat ganti PASANG SCRIPT CHATBOX SOBAT DISINI dengan script chatbox sobat.
 
4. Save, lihat hasilnya.

Membuat chatBox  Berada di samping itu ternyata mudahkan? kita hanya perlu menambah code tertentu saja. 
Have fun ...

0 komentar:

Post a Comment