当另一个div位于页面顶部时，滚动到div

Question

一旦另一个div（＃home-bottom）到达页面顶部，我希望我的页面滚动到div（#about）。

我有这个时间

<div id="home" style="padding-bottom">
    <div id="home-bottom" style="padding-top:1000px;"></div>
</div>
<div id="about" style="height:1000px;"></div>

使用这个jQuery：

$(document).ready(function(){
    var distance = $('#home-button').offset().top,
        $window = $(window);

    $window.scroll(function() {
        if ( $window.scrollTop() >= distance ) {
            $('html,body').animate({
                scrollTop: $("#about").offset().top}, 'slow');
        }
    });
});

它有效，但是一旦你到达约会你不能在任何地方滚动，因为你将立即滚动回到关于???