Javascript JQuery在调整窗口大小时设置动画会有很大的延迟

我有两个div浮动到我的主要内容的左侧和右侧。如果用户缩小他们的浏览器窗口，我想缩小div，这样他们就不会覆盖内容。相反，如果用户使窗口足够大，我希望它们再次扩展

为此，我创建了以下代码：

$(window).resize(function() {
  var windowwidth = $(window).width();

  if(windowwidth < 1400){
    $('#sliderholder').animate({width:'25px'});
    $('#contactholder').animate({width:'25px'});
  }

  if(windowwidth > 1400){
    $('#sliderholder').animate({width:'222px'});
    $('#contactholder').animate({width:'222px'});
  }

});

$（窗口）。调整大小（函数（）{
var windowwidth=$（window.width（）；
如果（窗宽<1400）{
$（'#sliderholder'）。设置动画（{宽度：'25px'}）；
$（'#contactholder'）。动画（{宽度：'25px'}）；
}
如果（窗宽>1400）{
$（'#sliderholder'）。设置动画（{width:'222px'}）；
$（'#contactholder'）。动画（{width:'222px'}）；
}
});

但这并不能正常工作——动画似乎是随机出现的，或者是被延迟了很多

有人知道如何改进吗

编辑：做了一些实验，发现它是延迟的，而不是不同步的

我在上面添加了

.stop（）

，似乎解决了这个问题

$(window).resize(function() {
  var windowwidth = $(window).width();

  if(windowwidth < 1400){
    $('#sliderholder').stop().animate({width:'25px'});
    $('#contactholder').stop().animate({width:'25px'});
  }

  if(windowwidth > 1400){
    $('#sliderholder').stop().animate({width:'222px'});
    $('#contactholder').stop().animate({width:'222px'});
  }

});

$（窗口）。调整大小（函数（）{
var windowwidth=$（window.width（）；
如果（窗宽<1400）{
$（'#sliderholder'）.stop（）.animate（{width:'25px'}）；
$（'#contactholder'）.stop（）.animate（{width:'25px'}）；
}
如果（窗宽>1400）{
$（'#sliderholder'）.stop（）.animate（{width:'222px'}）；
$（'#contactholder'）.stop（）.animate（{width:'222px'}）；
}
});

我在上面添加了

.stop（）

，似乎解决了这个问题

$(window).resize(function() {
  var windowwidth = $(window).width();

  if(windowwidth < 1400){
    $('#sliderholder').stop().animate({width:'25px'});
    $('#contactholder').stop().animate({width:'25px'});
  }

  if(windowwidth > 1400){
    $('#sliderholder').stop().animate({width:'222px'});
    $('#contactholder').stop().animate({width:'222px'});
  }

});

$（窗口）。调整大小（函数（）{
var windowwidth=$（window.width（）；
如果（窗宽<1400）{
$（'#sliderholder'）.stop（）.animate（{width:'25px'}）；
$（'#contactholder'）.stop（）.animate（{width:'25px'}）；
}
如果（窗宽>1400）{
$（'#sliderholder'）.stop（）.animate（{width:'222px'}）；
$（'#contactholder'）.stop（）.animate（{width:'222px'}）；
}
});

Well。。我只是浪费了我生命中的几个小时。这是一个多么简单的解决办法啊。。我只是浪费了我生命中的几个小时。O.O多简单的修复方法。