Tuesday, September 27, 2011

Home » » Tutorial: Cara buat hide credit box

Tutorial: Cara buat hide credit box




Tutorial ni direquest oleh adik Eeda Latif yang comel itu. Sesape yang nak wat gak silekanlah amek. Aiman tak kesah! (Cume kalau dah copy tu silelah bagi kredit ye! :koreks:*Wink*Wink*)

Step #1: Gi kat Design>Add Page Element>HTML
Step #2: Copy code di bawah ni dan pastekan dalam no. 1

<style type="text/css">
#gb{
position:fixed;
top:150px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:150px;
width:30px;
float:right;
cursor:pointer;
background:url('url gambar kredit') no-repeat;
}
.gbcontent{
float:right;
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.left = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<b><span class="Apple-style-span" style="color: #e06666;">KREDIT</span></b></div>
<div class="separator" style="clear: both; text-align: center;">
babydoll.nu</div>
<div style="text-align: center;">
bloggercandy.blogspot.com</div>
<div style="text-align: center;">
nama/url blog yg nak dikreditkan</div>
<div style="text-align: center;">
nama/url blog yg nak dikreditkan</div>
<div style="text-align: center;">
nama/url blog yg nak dikreditkan</div>
<div style="text-align: center;">
nama/url blog yg nak dikreditkan</div>
<div style="text-align: center;">
nama/url blog yg nak dikreditkan</div>
<div class="separator" style="clear: both; text-align: center;">
nama/url blog yg nak dikreditkan</div>
<div class="separator" style="clear: both; text-align: center;">

<div style="text-align:center">
<a href="javascript:showHideGB()">
[tutup sini]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.left = (30-gb.offsetWidth).toString() + "px";
</script></div>

Step #3: Save & preview!

:pandaGeli_04:Notes: Sume yang bold tu korang boleh tukar mengikut rasa nak manis ke masin ke okeh!


Sorila ye Eeda kalau lambat sangat menunggu tutorial ni. Maklumlah baru first taim nak wat tutor, nak pasang coding pun terkial-kial haha! :mHihi: Anyway harap Eeda puas hati!


Kalau suke dengan entry ni, jangan la memalu picit Like! Maseh!

3 comments

September 27, 2011 at 9:55 AM

wahhh..bgs nie tp kegunaan tuk ape yer kak?hehehe...sengal kan?

September 27, 2011 at 2:41 PM

Hehe... Oshin, ni kalau kite taknak semakkan sidebar kite ngan credit box tu. So ade option untuk bagi dia hide kat tepi so bile org klik dia baru dia bukak.

October 3, 2011 at 6:51 PM

thanks akk :3

Post a Comment

Terima kasih sebab komen! Saaaaayang korang!

Related Posts Plugin for WordPress, Blogger...

KITE KAWAN2!

 
Photobucket