Aariba Aariba - 4 months ago 38
jQuery Question

How to make slow the Scroll-Top Speed

ScrollTop is a jquery plugin (go to top of page), trying to make slow Scroll Speed, but not working. I have changed

scrollSpeed : 'fast',
to
scrollSpeed : 'slow',
but it still fast, nothing change.

JS:

$.fn.extend({

addScrollTop: function(options) {

var defaults = {
useObjWindow : false,
scrollSpeed : 'fast',
zIndex: '99'
}

var options = $.extend(defaults, options);

if($('body').find('.scrollTop-btn').length == 0) {
$('body').append('<div class="scrollTop-btn" style="display:none;"><i class="fa fa-chevron-up"></i></div>');
}

if(options.useObjWindow) {
var parentWindow = this;
var scrollWindow = this;
}
else {
var parentWindow = window;
var scrollWindow = 'html, body';
}

$(document).ready(function() {

$('.scrollTop-btn').on('click', function() {
$(scrollWindow).animate({scrollTop:0}, options.scrollSpeed);
});

$(parentWindow).scroll(function() {
$('.scrollTop-btn').hide();
var aTop = $('.scrollTop-btn').height() + 20;

if($(this).scrollTop() >= (aTop + 20)) {
$('.scrollTop-btn').css('z-index', options.zIndex);
$('.scrollTop-btn').show();
}
else {
if($('.scrollTop-btn').is(":visible")) {
$('.scrollTop-btn').hide();
}
}

});


});
}

});


Call:

jQuery(document).ready(function() {
jQuery("body").addScrollTop();
});


How to make it slower or smoother, when it go to top?

Answer

use jquery animate()

$('html,body').animate({ scrollTop: 0 }, 'slow');

refer this stack overflow question