无法在.animate scrollTop之后向上滚动

Question

var scroll_start = 0;
var startchange = $('#header');
var offset1 = $('#boxes').offset().top;

$(document).scroll(function () {
    scroll_start = $(this).scrollTop();

    if (scroll_start < offset1) {
       $('html,body').animate({
            scrollTop: ($('#boxes').offset()).top - 50
        }, 2500)
    } else if(scroll_start > offset1) {
        $('html, body').animate({
            scrollTop: 0
        }, 1000);
    }
});

我是编码jquery的新手，我想将平滑滚动应用于div。这段代码似乎在某一点上起作用，但当卷轴已经到达#boxes div时它会卡住。 （其他如果不工作）我想要一些方法能够在动画后自由滚动。一些解释真的很有用，谢谢！