Jumat, 17 Juni 2011

Cara Membuat Buku Tamu Show/Hide Dari Atas

Posted by alex marz 16.34, under | No comments



Bisa dilihat dengan mengklik gambar di samping layar seperti gambar dibawah...........
untuk cara mmbuatnya Cukup Kopi paste kode berikut pada menu  Rancangan, Edit Html, Tambah Gadget, dan Pilih Html/Java Script :





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


<!-- 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/AVvXsEj79KXNet9NqdcUDtGbuantw_BnQPx1GxmOPk_Rlfkxoxp9Q77mPpV-I79nfUCRUiu-bEYEMGqMH2fJt-BJo3XGN8xmjN9dNVT6cYoj4SIhTzSNXiOMfWjueQ8vNoKnj14PawnHN-KGYNw/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/AVvXsEhrfkZcrVMufFxlToFb4Aadbmn534SmaybESMTy9eokklTnjke4HA3ogpbHtdWJYSOposqC7KAfXzifbfrXrV5VS3W08fFj0xsklQZmJqVlqoGLNv-gQAwfZdyTLo7Kz5z2Z_dn5Wr3LB4/s1600/guestbook.png"  alt="cbox" title="Click here to open Guest Book"  /></a></center>



Selamat Mencoba


0 comments:

Posting Komentar

AbouT Me

Mengenai Saya

Foto saya
Saya Ingin Belajar Dari Hasil Postingan Yang Saya Share Kembali, Saya Tidak Pintar ,Saya Tidak Mahir, Saya Pun Tidak Sok Tahu, Kami Ingin Lebih Mengenal Atau Kami Ingin Sekali Belajar !!

ViSiToR

-=Alex-Marz-Onlin=-

FaVoriT

Entri Populer