1.Login
2.Rancangan
3.Tambahkan gadget, HTML java script
4. COPAS kode di bawah ini ke dalah kotak HTML
<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px solid #999;
background: #000;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
-moz-box-shadow: 0px 2px 5px 0px #f8f9b9;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:#000;">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px solid #999;
background: #000;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
-moz-box-shadow: 0px 2px 5px 0px #f8f9b9;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:#000;">
<!-- Simpan Kode cbox atau shoutmix nya disini -->
</div>
</div>
<br />
<div align="right"><a href="javascript:void(0);"
onclick="showHideAT()"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXXrdoJYfVwjKWlhP6DXEuJNpVF8Udo8T59MNtkGHzINq84TP0qaYohxDCqqid6C0i7HXv-Vp5A97a_l8eST79-IfTFnifEctGQ6clND7uQx5G065IFfUhGr4AVI2yuL3WuWTIC4N2Q1Q/s1600/CLOSE.png"
alt="close" title="Click here to Close Cbox" /></a></div>
<div align="right"><a href="javascript:void(0);"
onclick="showHideAT()"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXXrdoJYfVwjKWlhP6DXEuJNpVF8Udo8T59MNtkGHzINq84TP0qaYohxDCqqid6C0i7HXv-Vp5A97a_l8eST79-IfTFnifEctGQ6clND7uQx5G065IFfUhGr4AVI2yuL3WuWTIC4N2Q1Q/s1600/CLOSE.png"
alt="close" title="Click here to Close Cbox" /></a></div>
</div></div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>
<center><a href="javascript:void(0);"onclick="showHideAT()"/><img
border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqsueDL7ABm7MwD0tVIYZErk_XiKoA-PrJOXiBVbRDkg6WCYCyDbJRsKb0EpyUB3TDvTSNUlJL_eYsjXBrXMN5g7fC2FvsICYTP9afwfmYd1f9SaeTQCj4vANAyW017GeOkfjdz-AQTmM/s1600/guestbook.png"
alt="cbox" title="Click here to open Guest Book" /></a></center>
border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqsueDL7ABm7MwD0tVIYZErk_XiKoA-PrJOXiBVbRDkg6WCYCyDbJRsKb0EpyUB3TDvTSNUlJL_eYsjXBrXMN5g7fC2FvsICYTP9afwfmYd1f9SaeTQCj4vANAyW017GeOkfjdz-AQTmM/s1600/guestbook.png"
alt="cbox" title="Click here to open Guest Book" /></a></center>
5. Pada <!-- Simpan Kode cbox atau shoutmix nya disini --> Diisi dengan kode cbox sobat. untuk mendapatkan kode cbox bisa register ke sini http://cbox.ws/
Master... saya mau tanya nih :
BalasHapus1) Gimana cara buat buku tamu yang munculnya dari samping macam punyamu yang disamping itu, soalnya kalau muncul diatas kelihatan agak mengganggu.
2) Gimana caranya supaya tombolnya juga disamping bukan di sidebar macam punya saya.
maaf pertanyaan saya agak merepotkan, terima kasih sebelumnya :)
tutorialnya mantab gan
BalasHapus