Membuat Buku Tamu Keren Keluar Dari Atas

Buku tamu merupakan sarana yang digunakan pengunjung untuk berkomunikasi dengan pemilik blogger atupun website, dengan demikian ada feedback atau tanggapan antara pengunjung dan blogger. berikut saya akan menjelaskan cara memasang buku tamu sederhana yang muncul dari atas. silahkan anda baca secara teliti langkah-langkah berikut:

1. Silahkan anda masuk ke dasbor anda
2. kemudian pilih rancangan 
3. klik tambah gadget - pilih HTML / Javascript
4. Kemudian Copy Kode Script dibawah ini
5. Dan terakhir di save/simpan 

<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px solid #999;
background: #000;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
-moz-box-shadow: 0px 2px 5px 0px #f8f9b9;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:#000;">


<!--Letakkan Kode Script Cbox Anda Disini -->

Get this <a href="http://separuhtulisanku.blogspot.com/2013/02/membuat-buku-tamu-keren-keluar-dari-atas.html" target="_blank"><blink>widget</blink></a>


</div>
</div>

<br />
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqF4A7Naec8IvuT3PLtzGnZdLkLx9emRA6KTlKBSLqXQ0CoBBrp4oSYoZu9rgnfBqmr8VAwtfNoqay4mOJh115rfS5-L9JUs-GXh9Nm7CJpYjXVGBh7NT4mkvDjHhllTGoYbrSwTyIzuBl/s1600/close.png" alt="close" title="Klik Disini Untuk Menutup" /></a></div>

</div></div>


<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>

<div style='display:scroll; position:fixed; top:20px; right:0px;'><a href="javascript:void(0);"onclick="showHideAT()"/><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjubFlbYfPa8Y_AcE8M0L1ddVjkRP1OM_pPBYNnQFhlqdLd4j4DhY3F39hCmrIZDkUMVeQ5a6Qj9Ouk0Mu4x3rJBopjhk7gbdcBPGiXefIQjU4amh_NKFQ82fzMa0pLThhPVi1WR9JTFvR1/h120/Anim+Cbox.gif"  /></a>
</div>

Keterangan:
1. Yang berwarna biru, kamu bisa  ganti dengan Script CBox kamu.
2. Yang berwarna merah, posisi tombol Cbox di sebelah kanan, dengan tinggi atas 20px.
Untuk Melihat Demo nya, bisa klik disini

@kaptenpenguind Mungkin Ini Juga Yang Anda Cari :

.:: Related Post ::.

TUTORIAL BLOG

• Trik Baru Meningkatkan Pagerank Alexa
• Membuat Emotion Di Omegle Indonesia
• Domain Dot Com Gratis untuk Selamanya
• Cara Membuat Kotak Admin di Blog
• Membua Loading Blog Lebih Cepat dengan HTML Compressor
• Cara Membuat Effect Tulisan 3 Dimensi
• Cara Buat Text Area Otomatis Blok
• Cara Membuat Informasi di Bawah Postingan secara Otomatis
• Pajang MP3 AutoPlay di Blog
• CARA MEMBUAT DAFTAR ISI SECARA OTOMATIS
• Membuat Screen Saver di Blog
• Membuat Jam Digital di Blog
• Cara Membuat Teks Area Copy Semua
• Cara Mudah Download File di Scribd
• Cara membuat daftar isi secara random di blog
• Cara Membuat Tulisan Berjalan Di Buku Tamu CBOX
• Membuat Sumber Link Otomatis Saat Artikel di Copy Paste.
• Membuat Widget Fans Page FB/Like Box Menjadi Lebih Menarik
• Cara Membuat Tanda Tangan Di Bawah Postingan
• Mengubah Ukuran Template Blog
• Cara Membuat Auto Like Facebook
• Cara Membuat Tulisan Bergerak ke Atas
• Cara Mudah Membuat Readmore Otomatis di Blog Terbaru
• TUTORIAL - MEMBUAT BUKU TAMU MELAYANG