Question

我正在开发基于网络的应用程序（使用Javascript，Jquery，html，css），只需按下它就会滚动这些频道，因为频道数量大于屏幕高度，我必须使用滚动功能当向下或向上达到每10个通道时，我使用scrollTop方法来实现此目的。

所以让我简化这样的问题（如果有人回答这个问题，它有助于我达到我的实际目标）

我有元素列表，我知道如何滚动到列表中的特定元素，但我的目标是在第一次滚动到第8项，seTimeout然后滚动到列表的下一个特定元素（第14项）。我知道如何滚动到第一个特定元素，但我不知道超时之后如何滚动到下一个特定元素（第14项）。

这里是滚动第一个元素的代码，它可以正常工作：

`http://jsfiddle.net/xY7tx/2339/`

基于上面的代码工作，我试图添加以下代码，我的目标是首先它将滚动到项目8然后3秒超时然后它将滚动到第14项（这不会），请有人告诉我怎么能解决这个问题，这是第二个不符合要求的代码：

`http://jsfiddle.net/xY7tx/2338/`

谢谢！

Answer 1

您可以创建包含您想要使用的所有位置的数组，并在超时后删除数组的第一个元素

    var container = $('div'),
        scrollTo = new Array($('#row_8'),$("#row_10"),$("#row_14"),$("#row_2"));

    container.scrollTop(
        scrollTo[0].offset().top - container.offset().top + container.scrollTop() 
    );

    scrollTo.shift();

    var refreshIntervalId = setInterval(function(){
    if(scrollTo.length!=0){
      container.scrollTop(
          scrollTo[0].offset().top - container.offset().top + container.scrollTop() 
      );
       scrollTo.shift();
    }else{
    clearInterval(refreshIntervalId);
    }   
    },3000);

修改

添加检查数组是否为空停止间隔

Example

滚动到列表中的特定项目，然后滚动到列表中的下一个特定项目

1 个答案: