Cara Menciptakan Tombol Back To Up/Top Dengan Mudah

- Pada kesempatan kali ini admin mau share cara menciptakan tombol Back To Top dengan Efek Bounce pada blogger,

Bagaimana caranya min? silahkan ikuti langkah-langkah dibawah ini!

Langkah - langkah :

1. Masuk ke Blogger

2. Pilih Template

3. Edit HTML

4. Cari kode ]]></b:skin> gunakan Ctrl+F untuk pencarian lebih mudah

5. Masukan script dibawah ini sempurna diatas kode ]]></b:skin>

#Back-to-top {
text-align: center;
z-index: 9999;
position: fixed;
bottom: 40px;
right: 30px;
cursor: pointer;
display: none;
opacity: 0.7;
}
#Back-to-top:hover {
opacity: 1;
}

6. Cari isyarat </body> gunakan Ctrl+F untuk pencarian lebih mudah

7. Masukan script dibawah ini sempurna diatas isyarat </body>

<div id="Back-to-top">
<img alt="Pada kesempatan kali ini admin mau share cara menciptakan tombol Back To Top dengan Efek Bounc Cara Membuat Tombol Back To Up/Top Dengan Mudah" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXjKsCgNGKG3-b4rXr_dkC0HcaaWUxo2cAQiB1Gy7Dz49wRKJ3FMqLeyBWTsvETTH-zMwpAq8QnBE7P_LNyGLAlTk2G1Yz69spRHkYJHg0XTi5r9c-4QrDuHmjZt-kxDk3sI58nmijZOE/s1600/BackToTop.png" /></div>

<script type="text/javascript">
$(function() { $(window).scroll(function() {
    if($(this).scrollTop()&gt;400) {
        $(&#39;#Back-to-top&#39;).fadeIn();
        }
    else { $(&#39;#Back-to-top&#39;).fadeOut();}
    });
    $(&#39;#Back-to-top&#39;).click(function() {
        $(&#39;body,html&#39;)
        .animate({scrollTop:0},300)
        .animate({scrollTop:40},200)
        .animate({scrollTop:0},130)
        .animate({scrollTop:15},100)
        .animate({scrollTop:0},70);
        });
});
</script>

8. Ganti yang berwarna biru dengan gambar yang anda sukai. Kalo tidak, juga tidak bermasalah

9. Save Template dan lihat hasilnya.

Sekian cara mebuat Back To Top dengan Efek Bounce pada blog, biar bermanfaat.