Back to Top yang akan saya bagikan ini sebenarnya berfungsi untuk men-scroll tampilan pada blog dari bawah ke atas dengan hanya mengklik i...
Back to Top yang akan saya bagikan ini sebenarnya berfungsi untuk men-scroll tampilan pada blog dari bawah ke atas dengan hanya mengklik icon yang ada. Back to Top yang akan saya bagikan ini sangat ringan dan berguna untuk mempermudah pengunjung untuk kembali ke atas tampilan dengan efek Bounce (Memantul) dan Smooth (Lembut). Selain itu juga dilengkapi dengan Font Awesome sebagai icon.nya agar blog tidak menjadi berat.
Baca Juga : Memasang Plugin Font Awesome di BloggerBack to Top dengan efek Bounce dan Smooth
- Buka akun Blogger anda
- Pilih
Template
--Edit HTML
- Letakkan css berikut di atas
</style>
atau</b:skin>
- Letakkan kode berikut tepat di atas
</body>
- Tinggal
Simpan Template
/*Back To Top*/
#backtotop {background-color: #444;margin: 0;padding: 10px;border-radius: 2px;position: fixed;bottom: 50%;right: 10px;cursor: pointer;display: none;}
#backtotop:hover {background-color: #E73138;}
<a href='#' id='backtotop'><i class='fa fa-chevron-up' title='Back to Top'/></a>
<script type='text/javascript'>
//<![CDATA[
$(function(){$(window).scroll(function(){if($(this).scrollTop()>100){$("#backtotop").fadeIn()}else{$("#backtotop").fadeOut()}});$("#backtotop").click(function(){$("body,html").animate({scrollTop:0},800).animate({scrollTop:25},200).animate({scrollTop:0},150).animate({scrollTop:10},100).animate({scrollTop:0},50)});var e=$("body")})
//]]>
</script>