Question

我想创建一个JS每个带有特色元素的循环滚动顶部，等待动画结束，然后等待下一个执行。这是包含3个元素的原型代码：

      open_el = $('#0-article');
      setTimeout(function() {
        page.animate({
          scrollTop: open_el.find('.player').offset().top
          }, 'slow', function(){
            setTimeout(function() {
              open_el = $('#10-article');
              page.animate({
                scrollTop: open_el.find('.player').offset().top
                }, 'slow', function(){
                  setTimeout(function() {
                    open_el = $('#1-article');
                    page.animate({
                      scrollTop: open_el.find('.player').offset().top
                      }, 'slow', function(){
                    });
                  }, 2000);
              });
            }, 2000);
        });
      }, 1000);

在这里我等待1000毫秒才能滚动到＃0-article元素，然后在我等待2000ms滚动到＃10-article等等。我怎样才能做到这一点？

$('.featured').each(function(){
   ...
});

谢谢

Answer 1

我发现了具有递归功能的工作区：

var featured = [];

function scrollTopToFeatured(i) {
  if (i === 0) {
    return 1;
  } else {
    setTimeout(function() {
      page.animate({
        scrollTop: $('#'+featured[i-1]).offset().top
        }, 'slow', function(){
          scrollTopToFeatured(i - 1);
      });
    }, 1000);
  }
}

$('.featured').each(function() {
  featured.push($(this).attr('id'));
});

scrollTopToFeatured(featured.length);

谢谢你们

每个循环都使用scrollTop

1 个答案: