Question

嘿伙计我发现这个非常有用的java脚本粘性侧导航，它的效果很棒！我对js不太了解，我只是想知道是否有减慢滚动的速度？

function redrawDotNav(){

  var topNavHeight = 50;
  var numDivs = $('section').length;

  $('#dotNav li a').removeClass('active').parent('li').removeClass('active');     
  $('section').each(function(i,item){
    var ele = $(item), nextTop;

    console.log(ele.next().html());

    if (typeof ele.next().offset() != "undefined") {
      nextTop = ele.next().offset().top;
    }
    else {
      nextTop = $(document).height();
    }

    if (ele.offset() !== null) {
      thisTop = ele.offset().top - ((nextTop - ele.offset().top) / numDivs);
    }
    else {
      thisTop = 0;
    }

    var docTop = $(document).scrollTop()+topNavHeight;

    if(docTop >= thisTop && (docTop < nextTop)){
      $('#dotNav li').eq(i).addClass('active');
    }
  });   
}



$('#dotNav li').click(function(){

  var id = $(this).find('a').attr("href"),
  posi,
  ele,
  padding = $('.navbar-fixed-top').height();

  ele = $(id);
  posi = ($(ele).offset()||0).top - padding;

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

  return false;
});

demo

Answer 1

JavaScript代码中的行是这样的：

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

您可以将＆＃39;慢＆＃39;更改为＆＃39;快速＆＃39;，然后查看差异。

详细了解animate函数here。

Answer 2

您可以使用duration精确控制animate上的速度。这是函数签名：

动画（params，[duration]，[easing]，[callback]）

可以提供字符串fast和slow以分别指示200ms和600ms的持续时间。默认速度为400毫秒。您可以使用所需的精确速度（<毫秒）替换 nnn 来调整速度。

$('html, body').animate({scrollTop:posi}, nnn);

如何控制js导航滚动的速度

2 个答案: