07 February 2011

Tutorial : Hide ShoutBox . =D

Assalamualaikum ! :)


Selamat Pagi , Salam Sejahtera & salam 1 Malaysia ! :)) Hari ini aku berhasrat untuk membuat tutorial untuk hide shoutbox yang kadang-kadang merosak pandangan mate tu . Dan menjimatkan ruang di Blog anda =D. Ehem , dapat permintaan orang ramai la weyh ! GRR ! Sorang demi sorang aku bagi code . Maka , dengan Lafaz Bismillah , aku berkongsi dengan korang semua yep ? Yeayy ! Aku Bukannye kedekot ! wahwahwawawawa !


Tapi , sampai sekarang aku belum dapat jejak , siapa AIDAA ni . Dia mntak tolong , tapi , dia tak bagi LINK dia kat aku . *Takpe lah , wawa bagi jela yep . Nanti , kalau da bukak blog wawa , slowly ikot step yang wawa ajar ni , okay ? =D





Okay ! 
Ikut , step-by-step ! =)


Firstly , macam biase la kan , pegi kat Design =)


And then , Korang ADD A GADGET !



Then , korang Click kat HTML/JavaScript .


Then , korang Copy CODE bawah ni , ehem , kalau tak boleh nak click guna mouse tu , korang tekan CTRL dan Huruf C , (secara serentak !) HEHE =D

<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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6d41xbnPS5lUn7jgC_14kCtkdkZ6IWyakV4rL0-aCw3nU7CmPrQct24nw-fAFVAIZeLpZAoLpQNedYKLk6fGy820hsF8A91LIxJaTm77jWiLnWduqgR3DoYR7aiLmy8KyTGyT6FSsFlsd/s320/tabs.png') no-repeat;
}

.gbcontent{
float:left;
border:1px solid #b3b3b3;
background:#ffffff;
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 ShoutBox KORANG KAT SINII !!!!]

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




Kemudian , korang PASTE dan SAVE !
Kalau tak SAVE , maka , sia2 lah usaha anda , dan ikut step dari awal tadi semula . KWANG3 ! =D


Okay , sekian sahaja Turorial dari aku untuk hari ini . Terima Kasih Daun Keladi =)

sincere,aerith


LIKE dan KOMEN adalah HAK ANDA
TERIMA KASIH DAUN KELADI

2 comments:

Qurratu Aini Mohamed said...

macam mana nk dapatkan code shoutbox tuh wahai datin wawa? :)

Najwaa Malikk said...

oh , mark semuanya , then , awak ctrl+c :)