19 August 2010

Tutorial Hide Shout Box



Hehehe, tadi saya cuba hide shoutbox saya tu, hope you all senang cari juga, kekeke! Rasa nak jimat space, sebab tu saya hide, kalau you all nak hide shoutbox, just follow this simple steps ya.

1. Pergi ke DASHBOARD > DESIGN > PAGE ELEMENT > ADD A GADGET > HTML/JAVASCRIPT

2. Then, copy code dibawah ni ke dalam kotak HTML/JAVASCRIPT (Title just kosongkan).


<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://3.bp.blogspot.com/_LZtXSNcp76A/SzzN08B1K5I/AAAAAAAAA0U/QT4rY6-FhI8/s320/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #666666;
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">
MASUKKAN CODE SHOUT BOX

<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>

3. Copy code shout box you all, and ganti kan bahagian MASUKKAN CODE SHOUT BOX.

4. Lastly, click save. 

Credit tutorial: please, no paparazzi!


Azura: Senang kan?
Kiki


4 Sweet Roses!:

Thanks zura..aku dah berjaya melakukannya..setelah skian lame mencari..heheh

@one2paii~Hi hi, most welcome, glad you like it! Hehehe!

i applied your tutorial...^^v thanks

Post a Comment

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More