Script Buku Tamu Model Show Hide

26 Jan 2011 - - 26

Bismillah, Alhamdulillah....
Udah lama banget blog ini gak keurus, maklum saja kerjaan offline banyak, kerjaan online juga banyak, nggarap orderan web/ blog, dan ngelola beberapa blog yang lain.

Okey, langsung saja, ini saya ada koleksi script buku tamu dengan model show hide, jadi buku tamu yang biasanya nongkrong di sidebar blog, sekarang melayang disebelah kanan, dan hanya tampak tombolnya saja. Untuk menggunakan script ini, anda hanya cukup mengcopy script dibawah ini letakan di Gadget Html/ Java Script, letakan saja di sembarang tempat, boleh sidebar kanan, bagian header, atau bagian footer, edit teks YOURID dengan nama anda, atau nama blog anda, Buku Tamu Model Show Hide sudah bisa anda nikmati.

<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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwneYvHH73pHsyzdrSbJ-NSkTwkmbox1rPSscWaGHKKIox6n5X-adYSAP48RoznvFGvCli9lo1hHF__hHzXoyrkcPi_JfUVXE9kAsRmre7RpsyukC4Pi0zdNcQPcqkCuhVTB3Tk7Z4K-vt/') 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">
<!-- Start http://shoutbox.widget.me HTML Code -->
<iframe title="Shoutbox" src="http://shoutbox.widget.me/window.html?uid=YOURID" width="200" height="300" frameborder="0" scrolling="auto"></iframe>
<br /><a href="http://shoutbox.widget.me" title="Get your own free chat widget!">Shoutbox widget</a><br />
<!-- End http://shoutbox.widget.me HTML Code -->
<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>

Selamat mencoba, semoga bermanfaat.