JQuery IE 生涩幻灯片动画

Question

我有以下代码来动画显示/隐藏 div。

$(".headerClosed, .headerOpen").live("click", function(){
  $(this).next().slideToggle("slow");
}

这会显示并隐藏带有以下标记的 div:

<div class="details">
  <p>Date</p>
  <p>Text</p>
</div>

问题出在 IE 中(惊讶，惊讶!)，当 div 向下滑动时，动画很平滑，直到结束时突然出现抖动。我知道这是由于 div 的填充/边距设置造成的。

如果我使用

而不是

，那么动画会很平滑，但是一旦我向

添加任何填充或边距，动画就会出现抖动。如果内边距和边距设置使一个漂亮的 div 带有间距，那么如何让它出现抖动呢？

最佳答案

您的利润可能会崩溃。当您申请 float , overflow: auto或overflow: hidden对于滑动的元素，这种情况应该不再发生。

jQuery 设置 overflow: hidden在动画期间，这样边距就不会折叠。动画完成后，该属性将被删除。 <p> 的边距再次崩溃，因此最后你会有点急躁的跳跃。

关于JQuery IE 生涩幻灯片动画，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/909955/

上一篇：jquery - 使用 jqGrid 用户数据

下一篇：Jquery:选择具有特定来源的图像？

Answer 1

您的利润可能会崩溃。当您申请 float , overflow: auto或overflow: hidden对于滑动的元素，这种情况应该不再发生。

jQuery 设置 overflow: hidden在动画期间，这样边距就不会折叠。动画完成后，该属性将被删除。 <p> 的边距再次崩溃，因此最后你会有点急躁的跳跃。