如何在jquery淡入淡出后滚动到div？

Question

在我的网页，我有内容和按钮这样的：

<div id="1"> 
    ----some content---- 
</div> 
<ul class="pager"> 
    <li class="next" id="tut2"> 
    <a href="#">Next Tutorial &rarr;</a> 
    </li> 
</ul> 
<div id="2" style="display:none;"> 
    ----some content--- 
</div> 

这里是我的.js文件：

$(document).ready(function(){ 
    $("#tut2").on('click', function(event){ 
    event.preventDefault(); 
    $("#1").fadeOut(); 
    $("#2").fadeIn(3000); 
    return false; 
    }); 
    }); 

淡入代码完美的作品。当内容淡入时，滚动只保留在底部。我想要的是该页面应平滑滚动到div id=2或在其淡入后顶部。

Answer 1

您可以提供一个函数fadeIn，它将在动画完成后运行。例如：

$("#2").fadeIn(3000, function(){ 
    // scroll to #2 
    $("html,body").animate({ scrollTop: $("#2").offset().top }, 1000); 
});