Menyembunyikan Shoutbox

Kadang-kala 

apabila 

anda mencari ruang shoutbox di sesetengah blog

anda mendapati

ruang shoutboxnya disorok

di kiri atau kanan blog

Nak juga??

jom buat dengan mengikuti langkah berikut

Amaran: Shoutbox yang akan anda hasilkan akan tersembunyi di sebelah kanan blog anda ya :)

Langkah 1: Anda perlu menghasilkan shoutbox terlebih dahulu

*jika belum ada, ikuti tutorial di bawah

http://tutorialtautankasih.blogspot.com/2011/11/membuat-shoutbox.html

Langkah 2: Copy html di bawah ( gantikan yang berwarna merah itu dengan html shoutbox yang anda sudah hasilkan)

<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://i581.photobucket.com/albums/ss258/daenkrhapy/BT.jpg') 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">

<script type="text/javascript" src = "http://free-shoutbox.net/app/webroot/shoutbox/sb.php?shoutbox=40088871">

</script><blink>

<font size="2"><a href="http://daenkblog.blogspot.com/2009/08/cara-sembunyikan-shoutbox-buku-tamu.html">^÷•db•÷^</a></blink>

<div style="text-align:right">

<a href="javascript:showHideGB()">

[close]

</a>

</div>

</div>

</div>

<script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.right = (30-gb.offsetWidth).toString() + "px";

</script>

Langkah 3: Masukkan html ke dalam blog anda
klik di bawah untuk mempelajarinya

http://tutorialtautankasih.blogspot.com/2011/11/cara-memasukkan-html.html

Alhamdulliah siap :)

Terima kasih kerana sudi melihat tutorial yang tidak seberapa daripada saya ini...saya menulis sekadar berdasarkan pengalaman dan pemahaman yang saya peroleh..

Saya sangat berbesar hati menerima sebarang komen daripada anda untuk kebaikan bersama..Tinggalkan sebarang pandangan atau pertanyaan di ruang komen..:)