scroll函数与animate函数一起使用动画反应慢的问题

代码逻辑：当监测到界面高度到达一定的高度时，调用animate函数来将div块的高度变为相应高度，来完成div消失出现的动画效果。

问题：因为当窗口到达对应高度后，随着界面的滚动，将会大批量的触发animate函数，导致动画的卡死，系统需要反映一段时间才能展现出对应的动画。

解决方法：

• $("#div").stop(); 停止当前动画，继续下一个动画
• $("#div").stop(true) 停止元素的所有的动画
• $("#div").stop(false, true) 让当前动画直接到达末状态，继续下一个动画
• $("#div").stop(true, true) 清除所有动画，让当前动画直接到达末尾状态
  添加stop函数后能有效地解决动画加载慢的问题，但是还是会有一些卡顿的情况，此时在animate函数前加上一句对当前高度的判断既可以解决animate多次运行的问题。

原代码

$(window).scroll(function () {
    var height = $(window).scrollTop();
    var back_top = $('#back_top');
    if (height > 514)
        back_top.animate({height: '40px'});
    if (height < 514)
        back_top.stop(true).animate({height: '0'});
});

修改后代码

$(window).scroll(function () {
    var height = $(window).scrollTop();
    var back_top = $('#back_top');
    if (height > 514) {
        if (back_top.height() === 0)
            back_top.stop(true).animate({height: '40px'});
    }
    if (height < 514) {
        if (back_top.height() === 40)
            back_top.stop(true).animate({height: '0'});
    }
});