Jquery悬停效果动画div在动画时留下空间

时间:2012-06-28 19:35:19

标签: jquery html

我有一个页面,我已经开始在这里设置http://www.brandybrowauto.com/NEW.html,它有一个简单的3窗格窗口切换器。在悬停时,它将展开该窗格并使其他窗格变小,然后在mouseout上恢复正常。动画时,左窗格和中间窗格之间没有间隙,但是在中间窗格和右窗格之间有一个小条子打开。所有的窗格都是相同的大小,同时以相同的速度制作动画,我不确定是什么造成了这个差距,如果它甚至可以摆脱它。这可能很简单,但任何帮助都表示赞赏。

$(document).ready(function(){
  $("#left").hover(function(){
    $("#left").stop().animate({width:754},"fast");
    $("#right, #middle").stop().animate({width:100},"fast");
  }, function() {
    $("#left").stop().animate({width:318},"fast");
    $("#right, #middle").stop().animate({width:318},"fast");
  });

  $("#middle").hover(function(){
    $("#middle").stop().animate({width:754},"fast");
    $("#right, #left").stop().animate({width:100},"fast");
  }, function() {
    $("#middle").stop().animate({width:318},"fast");
    $("#right, #left").stop().animate({width:318},"fast");
  });

  $("#right").hover(function(){
    $("#right").stop().animate({width:754},"fast");
    $("#left, #middle").stop().animate({width:100},"fast");
  }, function() {
    $("#right").stop().animate({width:318},"fast");
    $("#left, #middle").stop().animate({width:318},"fast");
  });
});

1 个答案:

答案 0 :(得分:0)

原来这与jquery无关。再次看之后,这是因为我右边的窗格设置为向右浮动而中间和左边的窗格是向左浮动的。这在动画制作时会产生很小的差距,因为在动画完成之前,它们会相互动画。改变所以所有浮动左,它工作。感谢那些为我调查过的人。