Tutorial Shoutbox Terapung di Blogskin

Hey hey there!! rindu Diya tak?? over gile -_- oklah harini Diya nak share ngan korang sikit cara nak buat shoutbox korang terapung di udara atas blog korang.dulu shoutbox style ni jadi fenomena tapi sepi seketika..but now kembali lagi dengan codes yang telah di-upgradekan...macam best kan? Jom try

macam ni :)

1.Pergi >> Template

2.Then serentak click ctrl + F dan search kod </head>

3.Then copy dan pastekan kod yang panjang lebar ni kat bawah kod  </head>

<div style='display:scroll; position:fixed; top:10px; right:10px;'></a><br /><a href="javascript:void(0);"onclick="showHideAT()"/><img class= width="140" height="140"src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkNcghss0xN4mM1yqIIYeOVkZAMswfUObu4wyV9exPi3Se31c7JQqsG_9nH47EGsn4iIylDtF0ScWJ62VufyMrgQZCokGSdlbwEVQxA53MayICdMx5aea2QMwx5AMYRg9QY9TBFcj-lvmf/s1600/icon+shout.png" alt="Shoutbox" title="Shoutbox" /></a>
</div>
<style type="text/css">#at{position:fixed;

top:0;;}* html #at{position:relative;}.attab{height:100px;width:30px;float:left;cursor:pointer;background:url();}

.atcontent{float:right;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZP8iAbOILraho44mBdgABA5Mk6glfjICYl0KLDqFCdcPACIN0Q6t0ROVEGZpeSVmEmpM1JJRXjTCD4LE4H4utGbmQJbwYJDATFKwWKy5UNDRVFls1IL1BwMEnWImH2wqLqbAoX_Y4zhE/s1600/kak+yana+shout+frame+copy.png) no-repeat 0 0 transparent;width:800px;height:460px;center scroll ;

padding:56px 0 20px 5px;}</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.top = 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() no-repeat;">


<br /><br /><br /><br /><br /><br />

Masukkan Shoutbox korang dengan lebar 270 dan tinggi 280

<center><div id="author"><a href="javascript:void(0);" onclick="showHideAT()"><input type="button" value="Close" class="close" /></a></div></center></div></div><script type="text/javascript">var at = document.getElementById("at");at.style.top = (-200-at.offsetWidth).toString() + "px";</script></div></div>

HINT

merah : gantikan dengan kod icon korang

purple: gantikan dengan background shoutbox korang

hijau: masukkan kod shoutbox korang..boleh intai² shoutbox kat sini

Oleh disebabkan Diya dah lamee gilee tak bagi freebies kat korang,,nah ambiklah..

Thanks :

Doodle asal : Syafiq

Shoutbox Background : Sis Bihya

Basecode: Wan Hazel

http://i777.photobucket.com/albums/yy57/bunnymeloney/c60.png

http://i777.photobucket.com/albums/yy57/bunnymeloney/c61.png

http://i777.photobucket.com/albums/yy57/bunnymeloney/c62.png

http://i777.photobucket.com/albums/yy57/bunnymeloney/c63.png

http://i777.photobucket.com/albums/yy57/bunnymeloney/c64.png

http://i777.photobucket.com/albums/yy57/bunnymeloney/c65.png

http://i777.photobucket.com/albums/yy57/bunnymeloney/c66.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEin4ZMKYyOQBAPTDCYnFeHLmNS0m0iiO1EvjBaqZTdaDrScKYfPn1BWUZNPITXV3MKC9neKdfWBVnNo07yr4_lbUXwNqHH9GOxgRMPeZWBhk7_fsHG4_gPy8kPDmd_Xux6BKaceDCUtCnpK/s1600/cb4.png

http://i356.photobucket.com/albums/oo3/babyemo1413/bihasart2.png

http://i356.photobucket.com/albums/oo3/babyemo1413/bihasart4-1.png

http://i356.photobucket.com/albums/oo3/babyemo1413/bihasart3.png

http://i356.photobucket.com/albums/oo3/babyemo1413/bihasart4.png

http://i356.photobucket.com/albums/oo3/babyemo1413/shoutboxbyha2.png

-kalau nak ambil pape,komen dulu k-