cara membuat buku tamu melipat `

kali ini blognya mastony akan berbagi tentang bagaimana cara membuat buku tamu melipat(buka tutup)tutorial ini saya dapat dari mas ,b>kurniasepta sebetulnya sangat mudah tinggal menanaruh kode buku tamu /cbox nya diantara kode css berikut.sobat tertarik untuk mencoba ikuti langkah langkah berikut cara Membuat Buku Tamu bergeser ke kiri dan ke kanan bila di klik.
View DEMO
1. Login ke blogger
2. Pilih Rancangan kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan kode script berikut ini:

<style type="text/css">
#gb{
position:fixed;
top:100px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:2px;
}
</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">

Taruh widget BukuTamu /cbox disini

</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
nah ..cukup mudah bukan..?,Demikian cara membuat buku tamu atau widget cbox melipat
Selamat mencoba...

Terima kasih Anda telah membaca Artikel mengenai cara membuat buku tamu melipat dan Kata kunci untuk Artikel ini yaitu cara membuat buku tamu melipat

2 komentar:

Silahkan Anda Komentarkan Tentang Post ini yang baik dan sopan,
Jangan sampai komentar anda dianggap spam . . .