Tuto ini special buat anak-anak semua . haha. bukan juz nak hide kan cbox tapi boleh buat ia slide dari atas ke bawah . faham tak ? maksudnya bila korang tekan cbox korang, ia muncul dari atas and bila close, ia turun ke bawah.
Nak buat ? cewwah ! classic laa blog korang kan ? apa pun, follow me dulu yerk?!
STEP 1
Sign In > Dashboard > Layout > Add Gadget > HTML/Javascript
STEP 2
Copy and paste kod kat bawah :
<style type="text/css">
#gb{
position:fixed;
right:450px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.gbcontent{
float:left;
border:2px solid #99CCFF;
background:#ffffff; -moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 1500-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
Paste kod shoutbox korang.. kalau tak ada lagi , sign up kat sini yer <center><a href="javascript:void(0);" onclick="showHideGB()"><input type="button" value="Close" class="close" /></a>
</center></div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.top = (-400-gb.offsetWidth).toString() + "px";
</script>
<a class="west" href="javascript:void(0);" onclick="showHideGB()" title="Buku Tamu"><img alt="Buku Tamu"
heigth="125" src="
BUTTON KORANG NAK" border="0" /></a></center>
NOTANOTA !
Border and background (
warna purple) itu bolah ubah ikut warna pilihan hati korang. Kod warna boleh terjah
kat sini !. Border solid itu bolah tukar dengan
dotted atau dashed.
Height ="125" yang bold itu boleh tukar ikut tinggi button korang okayh.
Tukar "
BUTTON KORANG NAK" dengan url button yang kat bawah nie.. pilih laa ikut citarasa korang. Farah just copy button
http://suzuran89.blogspot.com punya. tenx a lot to her !
Warna merah dalam kod tu ganti dengan kod shoutbox korang !
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjawTrymIFtbAi0P8-xjxLQA8hejMTi2wkM3nR-YcxlnCvzUHR3y1JSfGQUk7sMyyzz4Qw2kH_XPr4d36sRy7_BE8H2s9yFV6nq5WeYCLyJZpCnU0hEbdayAEZVahsnBZ_gmdfR6M4Cr7Q/s1600/shoutbox1.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkEs0_bnCG8AORS1q8_CFk7dI7XMdFttUampMiy21blYm45rdM8QtuJo3lwa_9lVKY6hqMREAV3Anwe0HfPuiAcR8CYIDbGgBxcatra3LpoJ6-UDcnQHMB4TQckcqI6ijJpcSLAirvrEw/s1600/shoutbox10.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrDyIDxtKsGjYPkSb_K6zgHlUK7SJH7iyMHcfpgeBzQqe2IaW-VkP7jvOZTeymhnumKz9oFbRRioxEwPwpNAniS5STtSuh59970EeOFWcA4llsXbr6Kxn83slYig_8mYHKztkdEqsZa7o/s1600/shoutbox2.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGKxRRYPv5_iRA0jmrGuE_Rm9DSIXlphaQgIHhjG22S4HL5e7lUayZ05uLgwtQXvhxGq-IxxmAg-rQi40y7PNSuwUMYHObiFO64ZMRmgMZrVKdGLPbYVXu_YfM6G605JABQgnHboViie0/s1600/shoutbox3.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzrxhf9bgJ8Y7bOnmQxu32rYW4OmxFy1gF3l3hVuJLyuZFJAuJPpLMNox6AquoGG7OU_lDUbcqSG5JWKU3VTEjS1FazvaZ2QP_ZsxB8D4vfE7aP_4nbDLbSdzdafQeqoJW84hc6T-VpXc/s1600/shoutbox4.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoLamPdtfw_3U3RY9Zo9ubjw8tSGKYm8XhlVZFDa7GLWGWfFR8pylWo_pkYhIJdOuB1YPGjz8fdT3NvnVBVL7yVJw96k4jkftm9wa5xTug2fPDp0CiNszMzw9XZHpr3n1A3D-A-v2L1ZM/s1600/shoutbox7.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY_gM2KQe9WuYtMkosETEA6czNRI2zUglVcXvhGAjcAAeb0q4gOAyCNd9XvpX3J_IITaHmlLagXioOhS8IvXx1yJ_obxMTBlE9u3LX8m_rL8i6gV47mvwVLRy122wO5HLXeMrD86ACu8w/s1600/shoutbox6.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXISydfkU3auLqM5gfFtYvq1unFRxu997tvdvohKGJHHobKC9GdVHwoNKlc_uSpce3NfbEktZfQxaJJYarq6B9hJR1UWIW9wAp2uVbwX8zsY9Lqc__UB_TDyU21CFQtR30dReB4YG05e8/s1600/shoutbox9.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi15rZL07uKWlyewNSw5NH5rSCa25I2xo4apOLLRCZWWTepzo1b71Tj6ypCn-jWtfajq9YcFrv_nbbzTZIyexj6USMjqGgiQd3xg9ilCJ5IAlTX3lGTBpv1IMpwx33IjJrhq46bH-lNy1U/s1600/shoutbox8.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8W7GWJpi3W5WUOQ9YKjXc6M3NlG00pQnWTNqQ_S74SYp54_4XDW634oHCzR48bYbyfTYf0sHE2VTzpAQCmFip9f-QIs4k8dfd3gqmgREgASiaX5Fx-xoNU21dntV0rT9GbFdrfg26kK0/s1600/shoutbox5.png
STEP 3
Save , Preview and Enjoy !