jQuery：动画滚动到下一个只能工作一次

Question

我有一个简单的jQuery函数，点击.load-more的每个实例将在下一个.inside实例中褪色并滚动到它。第一个.load-more点击工作正常，成功滚动到.inside，但随后点击下一个.load-more淡入.inside的下一个实例，但由于某种原因没有滚动到它，不太清楚为什么？

的jsfiddle演示：http://jsfiddle.net/neal_fletcher/K9nMS/5/

的jQuery：

$(document).ready(function() { 

    var divs = $(".wrap > .div"); 
    for (var i = 0; i < divs.length; i += 3) { 
     divs.slice(i, i + 3).wrapAll("<div class='inside'><div class='new'></div></div>"); 
    } 

}); 


$(document).ready(function() { 

    Resize(); 
}); 

$(window).resize(function() { 
    Resize(); 
}); 

function Resize() { 
    var windowHeight = $(window).height() + 'px'; 
    $('.inside').css('height', windowHeight); 
} 


$(document).ready(function() { 

    $(".new .div:last-child").after("<span class='load-more'>More?</span>"); 
    $('.inside').hide().filter(":first-child").show(); 

    $('.load-more').click(function() { 
     var nextinside = $(this).parent().parent('.inside').nextAll(".inside:first"), 
      nextloadmore = $(this).nextAll(".load-more:first"); 
     $(this).hide(); 
     nextinside.fadeIn(); 
     nextloadmore.fadeIn(); 
     $('.wrap').animate({ 
      scrollTop: nextinside.offset().top - 0 
     }, 700); 
    }); 
}); 

任何建议或解决方案将不胜感激！

Answer 1

您需要更改位置scrollTop的每个连续设定为设定指标的倍数：

scrollTop: nextinside.index() * nextinside.offset().top 

我有工作了，你在这里：http://jsfiddle.net/K9nMS/7/