Membuat Buku Tamu Tersembunyi

Membuat buku tamu berguna untuk meninggalkan jejak pengunjung antar sesama blogger, baik itu tujuannya untuk bersilaturrahmi, atau hanya sekedar meninggalkan pesan, dll. Kali ini kita akan membahas cara memasang buku tamu namun dengan cara yang agak berbeda dan terasa unik, yaitubuku tamu yang tersembunyi. Walau namanya "buku tamu tersembunyi" tidak berarti form buku tamu tersebut tidak dapat dilihat, akan tetapi tetap terlihat namun hanya sebagian saja, yaitu tombol untuk menampilkan buku tamu tersebut, di mana untuk menampilkan buku tamu seorang pengunjung harus mengklik tombol tersebut, jadi sistemnya hampir tidak beda dengan tombol hide-show.

Untuk membuatnya caranya gampang, silahkan untuk menaruh kode berikut ke gadget HTML-nya teman2

<style type="text/css">
#gb{ postion
postion:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://sites.google.com/site/arywebhosting/gambar2ku/bukutamu.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #000000;
background:#999999;
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">

KODE BUKU TAMU ANDA DI SINI

<font size="2">
<div style="text-align:right">
<a href="javascript:showHideGB()">
[Tutup]
</a>
</div>
</font></div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

beberapa bagian yang dapat teman2 atur adalah

-. Warna biru adl URL gambar tombol. bagi teman2 yang ingin membuat desainan sendiri monggo...

-. Yang berwarna merah adalah border atau garis tepi, silahkan diatur ketebalannya dengan mengatur nilai/angka yang tertera. Teman2 juga bisa mengatur warna border tersebut [pilih kode warna di sini]

-. Orange adalah warna background-nya [pilih kode warna di sini]

-.Hijau diisi dengan kode buku tamu anda

-. hitam tebal, bisa teman2 atur kata2nya. Baik itu dengan kata2 seperti, close, keluar, dll

Mudah-mudahan bermanfaat.
Keywords:cara membuat buku tamu tersembunyi, make a hidden guestbook

Untuk kemajuan Blog Ini Silahkan isi Kotak Komentarnya Ya.. (For blog development, please fill the following blog comment Pal

Share |

Related Post