Negrionta Community
Energy Saving Mode Using CSS3

Move your mouse to go back to the page!
Gerakkan mouse anda dan silahkan nikmati kembali posting apa adanya

Copyright 2011 http://rizkymakkah.blogspot.com - All rights reserved
.

Sabtu, 04 Juni 2011

Membuat buku tamu blogger sembunyi di sisi blog

Cara Membuat buku tamu tersembunyi, Buku tamu atau tempat untuk menulis komentar di blogger sangatlah berguna sebagai wadah untuk berinteraksi antara pengunjung dan si empunya blog. Tutorial semacam ini tentu sangat sering kita jumpai saat kita berkunjung ke blog-blog lain untuk mencari informasi. Sekedar mengingatkan kembali, berikut langkah-langkah untuk membuatnya:


  • Login ke blog
  • Pilih tab rancangan, klik Tambah Gatget

    • Selanjutnya pilih HTML/JavaScript
    • Copas dan Simpan kode dibawah ini:

    <style type="text/css">

    #gb{
    position:fixed;
    top:140px;
    z-index:+1000;
    }
    * html #gb{position:relative;}

    .gbtab{
    height:220px;
    width:32px;
    float:left;
    cursor:pointer;
    background:url('http://i1089.photobucket.com/albums/i352/infokita1978/cooltext508153753.gif') no-repeat;
    }
    .gbcontent{
    float:left;
    border:5px solid #ff0000;
    background:#000000;
    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">

    Masukkan kode Shoutmix/iklan anda disini

    <div style="text-align:right">
    <a href="javascript:showHideGB()">
    <img src="http://i1089.photobucket.com/albums/i352/infokita1978/cooltext507237721.png" border="0" alt="Photobucket" /></a>
    </div>
    </div>
    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.right = (30-gb.offsetWidth).toString() + "px";
    </script></div>

    • Jika sudah selesai, Save dan lihat hasilnya.
  • Jangan lupa Komentarnya

0 komentar:

Tempel Komentar

Putra Makkah © 2011 Template by:
Negrionta Community