Welcome to my blog Friends

Selasa, 14 Desember 2010

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 "Tata Letak" atau "layout".
3. Pilih "Elemen Halaman" atau "Page Element".
4. Silahkan klik "Add a gadget" atau "Add to blog".
5. 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

0 komentar:

Posting Komentar

Visit My Facebook