16 Agu 2010

Cara Membuat Buku Tamu Melayang

Buku tamu adalah sebuah kotak yang dapat dibuat untuk komentar biasanya buku tamu cenderung di kotak gadget tapi saya kali ini akan membuat buku tamu melayang.Ikuti cara di bawah ini:
1.Masuklah ke akun blogger anda lalu pilih rancangan

2.Klik tambah gadget

3.Pilih HTML/Java Script

4.copy paste kode di bawah ini:
<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i38.tinypic.com/mhskm1.jpg') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
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.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">

<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe title="5bh7dn" src="http://www4.shoutmix.com/?5bh7dn" width="160" height="400" frameborder="0" scrolling="auto">
<a href="http://www4.shoutmix.com/?5bh7dn">View shoutbox</a>
</iframe>
<br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br />
<!-- End ShoutMix -->
<br />
<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

6.Ganti kode yang berwarna merah dengan kode shoutmix anda

7.Lalu klik simpan

SELAMAT MENCOBA................

0 komentar:

Posting Komentar