Pasang Chat box Melayang (Versi Galau)

Tweet

Untuk membuatnya sangat simple, kita tidak perlu mengutak-atik kode pada template kita, karena kalian tinggal memasangnya pada widget di Elemen Halaman. Untuk lebih jelasnya silahkan ikuti tahap-tahap pemasangannya dibawah ini:

1. Login Ke Blogger kalian
2. Pilih Rancangan ---> ELEMEN halaman
3. Tambah Gadget ---> Pilih HTML/Java Script
4. Simpan kode berikut dalam konten HTML/Java Scriptnya

<style type="text/css">
 #at{
 position:fixed;
right:5px;
z-index:+1000;
 }
* html #at{position:relative;}
 .attab{
 height:100px;
 width:30px;
float:left;
cursor:pointer;
background:url();
}
 .atcontent{
 float:left;
 border:2px solid #999;
 background: url(&quot;http://3.bp.blogspot.com/_bBL9ze_JZsw/TT_XA8lKqMI/AAAAAAAAAM0/uiy-BP_zbN8/s1600/black25.png&quot;);
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
 padding:10px;
-moz-box-shadow: 0px 2px 5px 0px #f8f9b9;
 }
 </style>
<script type="text/javascript">
 function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
 at.opened = !at.opened;
}
function moveAT(x0, xf){var at = document.getElementById("at");
 var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.bottom = x.toString() + "px";
 if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
 }
 </script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:url(&quot;http://3.bp.blogspot.com/_bBL9ze_JZsw/TT_XA8lKqMI/AAAAAAAAAM0/uiy-BP_zbN8/s1600/black25.png&quot;); ">

<SIMPAN SCRIPT SHOUTBOX KALIAN DISINI>

<img alt="Online Peoples" src="http://whos.amung.us/widget/xvjmva68zvp2.png" style="width:81px;height:29px;vertical-align:middle;" title="Total of online peoples" />
</div>
</div>
 <br />
<div align="left">Powered by : 
<a href="https://www.facebook.com/yumellodichpunkhead">У҅О҅Ц҅Я-И҆А҆М҆Е.Сһапԍе.Яеԛцеѕт Наѕ҅Вееп.Я҅Е҅Ј҅Е҅С҅Т҅Еԁ Ву҅Оцг.А҅Ц҅Т҅О҅М҅А҅Т҅Еԁ А҆Р҆Р҆Я҆О҆Ѵ҆Аӏ-Ѕ҆У҆Ѕ҆Т҆Е҆М</a></div>
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()">
<img border="0"   src="http://sites.google.com/site/mujijayaganesha1/img/close.png"
 alt="close" title="Click here to Close Cbox" /></a></div>
</div></div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.bottom = (-200-at.offsetWidth).toString() + "px";
</script>
<div style='display:scroll; position:fixed; bottom:20px; left:0px;'>
<a href="javascript:void(0);"onclick="showHideAT()"/>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhta0F8v3KcQ9nStsoqr4mwE-5TK-zkNTUAHRg90-fzqHO7rSGwMGUrHTwk2HCA31yGU783RNmUBNXaAefM8_B_PxrJtcx6ccJQK5IMYni0VScnjcg2lELs8TMjWomIubJ69oZjjdbBTpcA/s1600/chat+komentar+yu182"/></a>
 </div>
<div style="overflow:auto; width:auto; height:0px; padding:0px;
 border:0px solid     #e6e4e3;">
<center></center></div>

selalu beriimajinasi :p