Rabu, Januari 16, 2013

Cara Membuat Buku Tamu Turun dari atas

Chankak23 : Cara Membuat Buku Tamu Turun dari atas - Posting Sebelumnya , Cara Membuat Buku Tamu Turun dari atas kita bahas sekarang.
Shout Box
Dalam dunia blogger sapa yang tidak kenal dengan shoutbox atau buku tamu . bnyak cara untuk mempercantik buku tamu blog kita .. salah satu nya dengan buku tamu turun dari atas ... ! ingin membuatnya??? mari saya jelaskan!


1. login blogger
2. pergi ke tata letak
3. Klik "Add a Gadget" yang mana saja,
4.  kemudian pilih "HTML/JavaScript
5. masukan code berikut :
<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 #0000ff;
    background:url(http://i846.photobucket.com/albums/ab26/arifins/star.gif)#000000 repeat-x bottom center scroll;
    -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;">

<!----- Masukan Kode Buku tamu kalian----->

    </div>
    </div>

    <br />
    <div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="http://i846.photobucket.com/albums/ab26/arifins/DADclose.png" alt="close" title="Click here to Close Cbox" /></a></div>
    <span ><a href="http://nopribisnis.blogspot.com/2012/08/cara-membuat-buku-tamu-turun-dari-atas.html"><div style="color: rgb(68, 68, 68);">
    <span style="font-size:xx-small;">Get this Gadget</span></div></a></span>
    </div></div>
    <script type="text/javascript">
    var at = document.getElementById("at");
    at.style.top = (-200-at.offsetWidth).toString() + "px";
    </script>

    <a href="javascript:showHideAT()"/><img border="0" src="https://lh4.googleusercontent.com/-ngdy0Z0Wq0U/TJt6EJLcZ-I/AAAAAAAAAWM/1e2m6tOUicA/s100/Buku%252520Tamu.jpg" alt="Fivers" title="Klik untuk membuka Buku Tamu" style="display:scroll;position: fixed; bottom:350px;right:0px;cursor:pointer;style=" opacity:1;filter:alpha(opacity="100)&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50" ; /></a>

Tambahan :
1. utuk kode berwarna pink silahkan masukan kode buku tamu sobat
2. untuk kode berwarna biru silahkan kawan ganti dengan kode warna yang sesuai dengan template kawan
3. untuk kode berwarna merah silahkan kawan ganti dengan gambar latar belakang yang ingin kawan mau
4. untuk kode berwarna coklat silahkan kawan ganti dengan gambar yang di buat buku tamu

Akhirnya selesai juga postingan kali ini .. mengenai buku tamu blog ...!!
Demikianlah posting tentang Cara Membuat Buku Tamu Turun dari atas Semoga bermanfaat.
Comments :

Ada 0 komentar pada tutorial tentang Cara Membuat Buku Tamu Turun dari atas


Posting Komentar

Copyright © 2013 - Chankak23 Supported By Info Rinaldi - Zona Goal | Powered by Blogger.