Membuat Shoutbox Tersembunyi


Setidaknya saya sudah mengetahui cara ini sejak dulu sewaktu saya mengunjungi blognya kang rohman semua user yang lagi OL di sana ada bikin shoutbox tersembunyi, untuk itu saya memposting artikel ini bagi para pengguna blogger mania yang masih belum tau caranya, oke langsung ae kita ke TKP :


1. Login ke akun blogger anda.
2. Silahkan masuk ke "Layout".
3. Silahkan klik "Add a Gadget"
4. Jika sudah masukkan kode di bawah ini kedalam kotak yang tersedia :

<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('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') 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">

Letakkan disini kode Shoutbox Anda

</div>

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

6. Nah udah jadi, tinggal di save aja.

Sampai di sini dulu tutorial kita, lain kali di bahas lebih lanjut

Related Posts

Membuat Shoutbox Tersembunyi
4/ 5
Oleh