jquery - jquery - 尝试导航到具有相同链接的部分

Question

我试图导航到部分。我希望每次点击固定链接/页面滚动到下一部分。但它不能很好地工作。我只能导航到第一部分。怎么了 ？

小提琴演示

jQuery.fn.extend({
  scrollTo : function(speed, easing) {

      var targetOffset = $(this).offset().top;
      $('html,body').animate({scrollTop: targetOffset}, speed, easing);

  }
});

$('.btn-red').click(function(e){
   //e.preventDefault();

   $('section').next().scrollTo(400, 'linear');

});

Answer 1

请查看 .next() 的 jQuery 文档：http: //api.jquery.com/next/

我认为您应该设置一个变量来保存“滚动到”部分的索引，并在每次单击按钮时增加它并滚动。

如果您这样做有任何问题，请告诉我。

祝你好运 ：）

Answer 2

试了一下：

http://jsfiddle.net/BZbp7/108/


jQuery.fn.extend({

滚动到：函数（速度，缓动）{

  var targetOffset = $(this).offset().top;
  $('html,body').animate({scrollTop: targetOffset}, speed, easing);

} });

$('.btn-red').click(function(e){
   //e.preventDefault();
   var id_number = 1;
   while ( id_number <= 3 ) {
       $('#' + 1).scrollTo(400, 'linear');
        id_number ++;   
    }        
});