Tuesday, July 5, 2011

Cara Membuat Buku Tamu Melayang

Cara Membuat Buku Tamu Melayang, Tutorial baru dari saya. Sebenarnya trik ini sudah lama, tapi gak apalah buat nambah arsip, hehuuuy. Baiklah sudah cukup basa basinya, kita langsung ke pokok permasalahan. untuk screensoot bisa kamu lihat dibawah ini:


Jika kamu tertarik silahkan ikuti langkah-langkah dibawah ini:
  1. Login ke Blog anda
  2. Masuk ke Tata Letak »» Elemen Laman »» kemudian Tambah Gadged dan pilih HTML/Javascript
  3. Masukan kode dibawah 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://img534.imageshack.us/img534/8941/tabs2.gif') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #ff0000;
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">

MASUKAN KODE CBOX/SHOUTMIX DLL DISINI!

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>
</div>
</div>
 
     4.  Selanjutnya, Simpan Gadget.
Share this post
  • Share to Facebook
  • Share to Twitter
  • Share to Google+
  • Share to Stumble Upon
  • Share to Evernote
  • Share to Blogger
  • Share to Email
  • Share to Yahoo Messenger
  • More...

3 comments: