membuat tombol kembali ke atas di blog

 membuat tombol kembali ke atas di blog
 
 20 januari 2013
Tombol Back to Top berfungsi untuk memudahkan pengunjung untuk kembali kebagian atasdari suatu halaman. Tombol Back to Top nantinya akan terlihat di pojok kanan bawah apabila pengunjung mengarahkan scrollnya kehalaman bawah pada Blog Anda. Untuk yang ingin membuat tombol back to top atau tombol kembali ke atas menggunakan Jqueryversi 1.4.3, silahkanikutilangkahberikutini.
1. Login ke Blogger > Edit HTML
2. Carikode ]]></b:skin>
3. Letakkankodeberikutini di ataskode ]]></b:skin>

#toTop {
    width:70px;
        border:1px solid #ccc;
        background:#f7f7f7;
        opacity:0.8;
        text-align:center;
        padding:5px;
        position:fixed;
        bottom:10px;
        right:10px;
        cursor:pointer;
        display:none;
        color:#333;
        font-family:verdana;
        font-size:11px;
}
4. Kemudiancarikodepenutup </head> lalupasangkodeberikut di ataskode</head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
    $(window).scroll(function() {
        if($(this).scrollTop() != 0) {
            $('#toTop').fadeIn();   
        } else {
            $('#toTop').fadeOut();
        }
    });

    $('#toTop').click(function() {
        $('body,html').animate({scrollTop:0},800);
    });   
});
</script>
5. Setelahitucarilagikode </body> danpasangkodeberikut di atas</body>

<div id="toTop">Kembali</div>
6. Save template dan lihat hasilnya.


sumber : http://cyber-deso.blogspot.com

Share this

Related Posts

Previous
Next Post »