Tutorial : Hover Sliding Shoutbox Fatin Style

Assalamualaikum :)
Kalau tak tau amende Hover Sliding Shoutbox tu boleh cek SINI secra live. Nampakkan yang warna pink MESSAGE dekat tepi tu?  Maknanya bila korang hover je nanti shoutbox dia keluar. Shoutbox saya panjang sangat nampak buruk tapi saya malas nak generate code cbox baru. Kalau awak guna tuto ni, kena ada cbx yang saiz dia comel lote and bukan gedabak like mine. CREDIT THIS TUTO : KAK FATIN

1. Sign In Blogger >> Layout >> Add A Gadget >> HTML JavaScript

2. Copy code bawah ni :

<style>.maintitle {border-radius: 0px 15px 15px 0px;width:10px;padding:10px;color:white;font-size:12px;height:120px;margin-top:35px;margin-left:255px;background: pink;-webkit-transition: 1.0s;-moz-transition: 1.0s;}  #isikotak {position:fixed;border:4px solid pink;width:250px;left:-265px;top:170px;height:210px;padding:4px;text-align:left;background-color:white;background-image:url(URL IMAGE);background-position: right;background-repeat:no-repeat;color:#333333;-webkit-transition: 1.0s;font-size:8pt;font-family:trebuchet ms;-moz-transition: 1.0s; } #isikotak:hover {left:1px;  }</style> <center><div id="isikotak"><div class="maintitle">m<br />e<br />s<br />s<br />a<br />g<br />e</div><div style="margin-top: -180px;"><center>CODE CBOX ANDA</div></div></center>

BIRU : Ganti dengan code cbox awak
MERAH : Ganti dengan url image yang sesuai

3. Paste di HTML Java/Script

4. Preview and Save :)