带有autoHeight = true的jQuery UI手风琴在非默认窗格上有不必要的滚动条

Question

我遇到了jQuery手风琴的问题.当我创建一个内容窗格,其中非默认窗格的内容多于默认窗格,并且autoHeight为true时,这会在切换窗格时提供很好的动画,但非默认窗格会获得我不想要的滚动条.

您可以通过访问http://jqueryui.com/themeroller/,切换到"Blitzer"或"Humanity"等主题,然后打开示例手风琴的第3部分来看到这一点.使用Safari 3.2.1和Firefox 3.0.8发生在我身上.

如果切换到autoHeight = false,则不会发生这种情况,并且所有内容窗格都具有正确的高度,但内容窗格仅在动画结束时呈现并且看起来很奇怪,所以我不得不关闭动画以避免这种陌生感.

我要误读一些东西,或者这是jQuery UI手风琴中的一个错误.请帮我弄清楚它们中的哪一个(或两者都是).

Answer 1

我尝试了几种不同的东西.autoHeight:false本身不起作用.这最终对我有用:

$( "#accordion" ).accordion({
            heightStyle: "content",
            autoHeight: false,
        clearStyle: true,   
        });

我在具有固定宽度的SharePoint内容编辑器webpart中使用它,这在向accordion小部件添加内容时增加了高度问题.

Answer 2

使用这个组合选项适用于我,1.当前版本的jquery/ui

$( '#x' ).accordion({
    autoHeight: false,
    clearStyle: true
});

Answer 3

我面临类似的问题,对我来说,CSS的以下变化是有效的.

.ui-accordion .ui-accordion-content{
overflow:visible !important;
}

Answer 4

如今(使用jQuery UI - v1.8),只需autoHeight即可,不再出现滚动条.

jQuery("#accordion").accordion(
  {
    autoHeight:false
  }
);

Answer 5

已经heightStyle: "content"帮助解决了我的问题.参考:手风琴

Answer 6

我知道这已经过时了,但是我遇到了这个问题并降落在这里.可以在此处找到不破坏动画并摆脱动画的解决方案:

对于那些不想点击的懒人,简短的回答是:

.ui-accordion .ui-accordion-content { overflow:hidden !important; }

在手风琴的CSS中

在这个问题的所有答案中,此解决方案没有不必要的滚动条,动画也没有被破坏.然而,每个`<div>`的高度是相同的.不过,谢谢你分享这个解决方案诺亚.+1 (2认同)

Answer 7

尝试这个