4

我的页面上有一个手风琴小部件,它在动画打开时扩展超过它应该停止的位置(在动画结束时捕捉回正确的大小),并在它开始动画关闭时捕捉到相同的扩展大小。在我的例子中,手风琴内容应该扩展到 150px,但我在 Chrome 的 Inspect Element 窗口中看到它的动画并看到它短暂地变成了 185px。

我看到其他人建议在将手风琴部分更改为position: absolute简单地进行计算时,当它进行大小计算时,填充和/或边距可能会欺骗 jQuery。

http://jsfiddle.net/shadowycore/T5fnZ/1/

任何帮助都将不胜感激。

4

6 回答 6

9

我遇到了同样的问题,几个小时后,我终于设法通过添加以下 CSS 来解决它:

 .ui-accordion .ui-accordion-content{
      box-sizing:content-box;             
      -moz-box-sizing:content-box;
}

我希望这有帮助

于 2013-05-30T13:50:19.870 回答
8

溢出:汽车是关键!!如果您检查 jquery 手风琴示例,您会注意到他们的手风琴没有跳转,我发现它归结为 .ui-accordion-content 类的 overflow:auto 样式。

因此,您需要做的就是将 overflow:auto 样式添加到内容类。

.ui-accordion .ui-accordion-content{
  overflow:auto;
}
于 2013-08-29T09:41:02.033 回答
2

在手风琴内的my和标签上设置margin:0and ,跳动消失了。padding:0h3ul

于 2014-06-18T21:52:43.993 回答
2

对我来说,它最终只是有人在 .ui-accordion-content 潜水中设置了一个令人毛骨悚然的最小高度......

.ui-accordion-content{ min-height: unset; }

为我工作

于 2015-09-02T15:40:06.127 回答
0

它看起来像一种错误。在 jqueryui AIP 示例上也有同样的效果:

http://api.jqueryui.com/accordion/#entry-examples

于 2013-01-20T01:41:21.603 回答
0

一个简单的解决方法是将小部件包含在<div>标签中,然后将手风琴应用于该标签。否则,手风琴动作会尝试调整边距和填充,这会导致“跳跃”。

于 2015-02-19T20:02:52.520 回答