Question

我的主要内容左侧和右侧有2个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'});
  }

});

但这不能正常工作 - 动画似乎是随机发生的，或者是非常延迟的。

有人知道如何改善这个吗？

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

Answer 1

我在上面添加了.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'});
  }

});

JQuery动画大大延迟窗口调整大小

1 个答案: