Pages

Senin, 27 Februari 2012

CARA MEMBUAT BUKU TAMU MELAYANG


CARA MEMBUAT BUKU TAMU MELAYANG


Cara Membuat Buku Tamu Melayang- Assalamu'alaikum, Kali ini kita akan membahas tentang Cara membuat buku tamu melayang,. Maksudnya buku tamu/cbox kita melayang-layang. Kita akan menaruh bukutamu/cbox kita di pinggiran halaman blog kita.. Jadi akan membuat memperamping widget kita apa bila menumpuk.. Sebenarnya tidak hanya buku tamu/cbox saja yang bisa di taruh,, konten lain pun juga bisa lho... Tapi kebanyakan yang di taruh adalah widget bukutamu/cbox. Buku tamu melayang yang akan kita buat berbeda dari bukutamu melayang lain.. Liat perbedaannya, bukutamu blog ini dan buku tamu biasa lain.. ?? Beda bukan..? Saya menemukannya di postingan sahabat saya yaitu kang beben . Tertarik?? Silahkan mencoba langkah-langkah berikut : 
       1.   Login Blogger
       2.   Rancangan ->> Edit HTML
       3.   Letakkan Kode Berikut  diatas/sebelum kode ]]></b:skin> 
#menuShow{
border:none;
position:fixed;
margin-top:33px
}
#menuSelect{
border:3px solid #f60;
background-color:#F7DFB5;
-moz-border-radius:10px;
-webkit-border-radius:10px;
position:fixed;
width:auto;
height:auto;
padding:5px;
}
4.    Simpan Template
5. Lalu pidah ke Elemen Laman
6 Tambah Gadget->> HTML Javascript
7 Letakkan Script Beikut :


<div id="menuSelect">
<center><a href="#" onclick="moveOnMenu();moveOffSelector()">
<img src="http://form.doyi.net/button_close.png" width="" height="" border="0" /></a></center>
ISIKAN
KONTEN ANDA
</div>

<div id="menuShow">
<a href="#" onclick="moveOffMenu();moveOnSelector()">
<img width="60" height="115" src="http://i36.tinypic.com/1zoajqd.gif" /></a>
</div>

<script type='text/javascript'>//<![CDATA[
// (C) 2001 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header.
Show="yes";var OffX=-300;var PosX=0;var PosY=0;var speed=10;var increment=15;var incrementNS4=5;var is_NS=navigator.appName=="Netscape";var is_Ver=parseInt(navigator.appVersion);var is_NS4=is_NS&&is_Ver>=4&&is_Ver<5;var is_NS5up=is_NS&&is_Ver>=5;var MenuX=OffX;var SelX=PosX;var sPosX=PosX;var sOffX=OffX;if(Show=="yes"){sPosX=OffX;sOffX=PosX;MenuX=sOffX;SelX=sPosX;}
if(is_NS4){increment=incrementNS4;Lq="document.layers.";Sq="";eval(Lq+'menuSelect'+Sq+'.left=sPosX');eval(Lq+'menuShow'+Sq+'.left=sOffX');eval(Lq+'menuSelect'+Sq+'.top=PosY');eval(Lq+'menuShow'+Sq+'.top=PosY');}else{Lq="document.all.";Sq=".style";document.getElementById('menuSelect').style.left=sPosX+"px";document.getElementById('menuShow').style.left=sOffX+"px";document.getElementById('menuSelect').style.top=PosY+"px";document.getElementById('menuShow').style.top=PosY+"px";}
function moveOnMenu(){if(MenuX<PosX){MenuX=MenuX+increment;if(is_NS5up){document.getElementById('menuShow').style.left=MenuX+"px";}else{eval(Lq+'menuShow'+Sq+'.left=MenuX');}
setTimeout('moveOnMenu()',speed);}}
function moveOffMenu(){if(MenuX>OffX){MenuX=MenuX-increment;if(is_NS5up){document.getElementById('menuShow').style.left=MenuX+"px";}else{eval(Lq+'menuShow'+Sq+'.left=MenuX');}
setTimeout('moveOffMenu()',speed);}}
function moveOffSelector(){if(SelX>OffX){SelX=SelX-increment;if(is_NS5up){document.getElementById('menuSelect').style.left=SelX+"px";}else{eval(Lq+'menuSelect'+Sq+'.left=SelX');}
setTimeout('moveOffSelector()',speed);}}
function moveOnSelector(){if(SelX<PosX){SelX=SelX+increment;if(is_NS5up){document.getElementById('menuSelect').style.left=SelX+"px";}else{eval(Lq+'menuSelect'+Sq+'.left=SelX');}
setTimeout('moveOnSelector()',speed);}}//]]>
</script>


Catatan: Warna ......: Ganti dengan Kesukaan anda

Demikian tutorial Cara membuat Buku Tamu Melayang... Kalau ada kesulitan tanya.... Ok Wa'alaikumsalam

Tidak ada komentar:

Posting Komentar