cara-cara nak tukar icon sidebar shoutbox



salam u all,mlm ni agak bz skit..huhu tpi sempat2 guk lrr aerol nak wat satu tutorial neyh,tak nak kecewakan request org..haha oke lrr,kalau nk ikut tutorial ni korang bole follow step by step kat bawah ni...

1,pergi design/cari port2 mane korang nak letak widget shoutbox tu/then pilih html script..

2.salin code2 bawah ni... 

<style type="text/css">
    #gb{
    position:fixed;
    top:50px;
    z-index:+1000;
    }
    * html #gb{position:relative;}

    .gbtab{
    height:100px;
    width:30px;
    float:left;
    cursor:pointer;
    background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ2dGQjNg2727B17BZMjZJSIAn8zB2hLEFOe894-WRcdzPjInSgZjtc9wLchHuJLQBBJ4PicsdMd1lamCCJzokeWd7mQbvnR9wexwGRw3MdfK_Wx3gl1RF8xT7R0BXGLFeB54_fVKPyLAN/s320/tabs.png') no-repeat;
    }
    .gbcontent{
    float:left;
    border:2px solid #666666;
    background:#F5F5F5;
    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">
    Kod Shoutbox
    <div style="text-align:right">
    <a href="javascript:showHideGB()">
    [close]
    </a>
    </div>
    </div>
    </div>
    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.right = (30-gb.offsetWidth).toString() + "px";
    </script>
 3,pada tulisan bewarna biru tu korang letak url imej kesukaan u all,, ,u all boleh upload gmbar kesukaan u all kat photobuckt/imej shack etc.. .

4,pada tulisan warna merah tu pula korang letak code shoutbox korang.

 thank nelly here for request this tuto.. .

1 ulasan:

Anna Syazana berkata...

wahh..saya dah lama cari tuto nie..thank u so much.....

Artikel menarik

Related Posts Plugin for WordPress, Blogger...

lik lak,kejap jeww ^^

Daisypath Anniversary tickers