如何在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); 
});