Question

我一直试图想出这个，我只是看不出任何问题 - 同样的手风琴（同样的jqueryui版本1.9.2）在其他网站上没有问题，我甚至切换主题使用与其他网站相同的一个，我仍然得到这个的波涛汹涌。

它不应该是jquery ui主题，因为它正常工作 here

任何想法可能是什么？

Answer 1

对于未来的读者，当我没有将手风琴行的内容包装在div标签中时，我也遇到过这个问题：

<强>为：

        <div class="accordion">
            <h3>Delivery Address</h3>
            <table class="address">
                <tr><td>...</td></tr>
            </table>
        </div>

不可

<div class="accordion"> <h3>Delivery Address</h3> <div> <table class="address"> <tr><td>...</td></tr> </table> </div> </div>

Answer 2

.ui-accordion .ui-accordion-content {
    padding: 1em 2.2em;
}

问题在于这个css。如果您将其更改为px而不是em，则它可以正常运行。

Answer 3

我遇到了类似的问题。看了几个不同的解决方案。我发现这是一个保证金问题。

这对我有用：

#accordion .ui-accordion-header {
    margin:0;
}

我顺便设置hightstyle内容。

希望这有帮助！

Answer 4

在我的情况下，这是由我的手风琴标题的边缘以及手风琴内容中元素的余量引起的。您需要将这些元素的边距设置为0.如果要在这些元素之间添加空格，可以使用填充，它不会导致问题。

#accordion h3 {
margin: 0;
padding: 10px 0;
}
#accordion p {
    margin: 0;
    padding: 10px 0;
}

我在手风琴内容的div中使用了段落标签。如果您使用其他内容，请确保该元素的边距设置为0.

Answer 5

顺畅行动的关键是＆＃34; heightStyle＆＃34; EG

$( "#accordion" ).accordion({
    heightStyle: "content"
});

Answer 6

我认为您忘记在标记

中添加所有文件依赖项

<script type='text/javascript' src='http://www.georgiancollege.ca/programs/wp-includes/js/jquery/jquery.js?ver=1.8.3'></script>
<script type='text/javascript' src='http://www.georgiancollege.ca/programs/wp-includes/js/jquery/ui/jquery.ui.core.min.js?ver=1.9.2'></script>
<script type='text/javascript' src='http://www.georgiancollege.ca/programs/wp-includes/js/jquery/ui/jquery.ui.widget.min.js?ver=1.9.2'></script>
<script type='text/javascript' src='http://www.georgiancollege.ca/programs/wp-includes/js/jquery/ui/jquery.ui.accordion.min.js?ver=1.9.2'></script>
<script type='text/javascript' src='http://www.georgiancollege.ca/programs/wp-includes/js/jquery/ui/jquery.ui.button.min.js?ver=1.9.2'></script>

包含所有依赖项，然后它应该正常工作..

Answer 7

我在Drupal中使用Views Nested Accordion构建了一个类似的嵌套手风琴问题。我删除了带有.ui-accordion .ui-accordion-content {height: auto !important;}的views-nested-accordion.css的第38行，它解决了我的问题。

为什么jQuery UI手风琴打开/关闭动画如此不稳定？

7 个答案: