MEMBUAT BUKU TAMU DI KLIK MUNCUL DARI ATAS

Sebuah tips dari saya yang pemasangan kodenya pada gadget, buku tamu sobat nantinya akan muncul dari atas ketika pengunjung blog mengkliknya, postingan saya kali ini hampirsama dengan tips saya yang berjudul Buku Tamu Tampil di Samping cuman bedanya pada postingan ini gambar seperti di bawah ini akan tampil dimana sobat menyimpan kode dan letak gadeget.

Bagi sobat-sobat yang tertarik silahkan copy code dibawah.

<style type="text/css"> 

#gb{ 
position:fixed; 
right:350px; 
z-index:+1000; 
padding: 5px 15px; 
} 
* html #gb{position:relative;} 
.gbtab{ 
height:100px; 
width:300px; 
float:center; 
cursor:pointer; 
background:url(blog-bg.png); 
} 
.gbcontent{ 
float:center; 
background:#fff; 
border-right: 5px solid orange; 
border-bottom: 5px solid magenta; 
border-top: 5px solid cyan; 
border-left: 5px solid pink; 
-moz-box-shadow: 0 20px 20px #000; 
-moz-border-radius-topleft:1px; 
-moz-border-radius-topright:1px; 
-moz-border-radius-bottomleft:1px; 
-moz-border-radius-bottomright:1px; 
padding:10px; 
} 
</style> 
<script type="text/javascript"> 
function showHideGB(){ 
var gb = document.getElementById("gb"); 
var w = gb.offsetWidth; 
gb.opened ? moveGB(0, 1500-w) : moveGB(20-w, 0); 
gb.opened = !gb.opened; 
} 
function moveGB(x0, xf){ 
var gb = document.getElementById("gb"); 
var dx = Math.abs(x0-xf) > 25 ? 35 : 1; 
var dir = xf>x0 ? 1 : -1; 
var x = x0 + dx * dir; 
gb.style.top = x.toString() + "px"; 
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} 
} 
</script> 
<div id="gb"> 
<div class="gbtab" onclick="showHideGB()"> 
</div> 
<div class="gbcontent"> 
<span style="color: #660000;"><!-- Script Chatbox sobat nya disini --></span> 
<center><a href="javascript:void(0);" onclick="showHideGB()"><input class="close" type="button" value="Close" /></a>   
</center></div> 
</div> 
<script type="text/javascript"> 
var gb = document.getElementById("gb"); 
gb.style.top = (-400-gb.offsetWidth).toString() + "px"; 
</script> 
<a class="west" href="javascript:void(0);" onclick="showHideGB()" title="Buku Tamu"><img alt="Buku Tamu" border="0" heigth="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAhr6N5mvR1yLcHuLtNlbZwL4Mlf_pENnwlDcfpbPypO2KiCJKt9W-ftSxL6ZNhhJOTuv2KDzV0DUSUDl9dJ-hs9gS2Lf1xUSCTkcEo75MzW5YhHiKUgyXouj2TR80sTR_YjeE2joHHM0/s1600/Guestbook.png" /></a> 

Ket :

Ganti kode yang berwarna merah dengan kode buku tamu sobat bila belum tau cara membuat buku tamunya klik disini.

Jika sobat ingin menganti gambar tampilannya ganti URL yang berwarna kuning dengan URL gambar sobat.

Semoga bermanfaat yah sob? selamat mencoba...

Theant Budiana

About the Guest Author:
Saya bukanlah orang yang ahli dalam dunia blogger tapi saya mencoba untuk berbagi ilmu dari apa yang saya ketahui dari paman saya, saya sangat suka blogging dan berbagi ilmu, tapi bukan berarti saya master blog salah besar jika sobat anggap saya hebat saya hanya seorang anak kampung yang mencoba untuk tidak kampungan dan tertinggal informasi alias GAPTEK, banyak artikel yang saya tulis di Blog Urang Sunda dan lihat juga blog saya satu lagi di Dunia Maya Saya dan klik disini untuk mengetahui lebih lanjut tentang saya

Kindly Bookmark this Post using your favorite Bookmarking service:

warning

Anda bingung?
Jangan ragu untuk bertanya kepada saya lewat komentar di bawah, saya akan mencoba menjawabnya sesegera mungkin, bahkan jika sobat ada saran untuk saya silahkan jangan ragu untuk memberi saran kepada saya asalkan komentar no spam. Komentar anda, adalah bekal untuk kemajuan blog saya, saya akan kunjungi balik blog sobat jika sobat meninggalkan jejak sobat disini.