Menggunakan jquery scrollto pada website


pada sebuah website biasanya terdapat panah kecil yang menunjuk ke atas yang fungsinya untuk memnudahkan user dalam scroll keatas dengan menekan tombol panah tersebut.


sekarang bagaimana cara menambahkan panah tersebut

mari kita siapkan catatan nya he he he

pertama tambahkan kode dibawah ini di bagian bawah sebelum footer anda

<a href="#" id="back-top" class="scrollup">Scroll</a><!-- end scroll to top of the page-->

kemudian buatlah kode javascript berikut kedalam halaman website anda

$(document).ready(function(){
initTopButton();
});
function initTopButton(){
var $=jQuery;
$("#back-top").hide();
$(function(){
$(window).scroll(function(){
if($(this).scrollTop()>0){
$('#back-top').fadeIn();
}else{
$('#back-top').fadeOut();
}
});
$('a#back-top').click(function(){
$('body,html').animate({scrollTop:0},600);
return false;
});
})
};

tidak perlu di jelaskan kan udah pada pinter semua yang paling penting adalah kode yang berwarna merah

kode tersebut untuk menambahkan animasi dengan scrolltop dengan durasi 0.6s.

untuk cssnya silakan di custom sendiri ya.

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel