JQuery 手风琴自动高度问题 [英] JQuery Accordion Auto Height issue

问题描述

我正在使用 JQuery 手风琴.我在这里有这个页面:http://www.hauppauge.com/site/support/support_colossus.html#tabs-6

I am using JQuery Accordion. I have this page here: http://www.hauppauge.com/site/support/support_colossus.html#tabs-6

发生的情况是自动高度需要一些时间来加载，在加载之前内容下方有很多空白.当它最终加载时，高度将扩展到更长，然后捕捉到内容的正确高度.有没有办法做到这一点?我只是希望能够单击手风琴"选项卡并让它平滑地扩展到内容的确切高度.

What happens is the Auto Height is taking some time to load, before it loads there is a lot of white space below the content. When it finally does load the height will expand to longer then snap up to the correct height of the content. Is there a way for this to be seamless? I just want to be able to click an Accordion tab and have it expand smoothly to the exact height of the content.

2014 年 8 月 8 日更新:

如果您使用 heightStyle: "content">1.9 及更高版本(Tarun 的答案)

Use heightStyle: "content" if you're using version 1.9 and higher (Tarun's answer)

将 autoHeight: false 用于 1.8 及更低a>(iappwebdev 的回答)

Use autoHeight: false for 1.8 and lower (iappwebdev's answer)

推荐答案

那为什么不直接将 autoheight 设置为 false?

So why don't you just set autoheight to false?

$( ".selector" ).accordion({ autoHeight: false });

http://jqueryui.com/demos/accordion/#option-autoHeight

编辑

看你的评论:

// Accordion
$("#accordion").accordion({ header: "h3" });
$("#accordion").accordion({ collapsible: true });
$("#accordion").accordion({ autoHeight: false, navigation: true });

您正在初始化手风琴，然后向其添加更多选项.你为什么要这样做?autoHeight 的默认值是 true，所以每个标签都有一个固定的高度.一次调用所有选项:

You are initialising the accordion and then you add more options to it. Why are you doing that? Default value for autoHeight is true, so every tab gets a fixed height. Put all options in one call:

// Accordion
$("#accordion").accordion({
    header: "h3",
    collapsible: true,
    autoHeight: false,
    navigation: true 
});

编辑

关于您的第二条评论:

看看 http://jqueryui.com/demos/accordion/#option-标题.您可以看到默认设置了选项 h3，因此您不必在通话中设置它.

Have a look at http://jqueryui.com/demos/accordion/#option-header. You can see that option h3 is set by default, so you don't have to set it in your call.

您可以在这里得到问题的答案:JQuery 手风琴没有无需 h3 标签即可工作.

And you get an answer to your question here: JQuery accordion doesn't work without h3 tags.

通过 jQuery API 来提高您的知识非常重要.对于 jQuery API，请访问 http://api.jquery.com/，对于 jQuery UI，请访问 http://jqueryui.com/demos/.如果您还有其他问题，请在尝试解决问题并在进行一些研究之后提出.

It's pretty important to go through jQuery API to improve your knowledge. For jQuery API go to http://api.jquery.com/ and for jQuery UI go to http://jqueryui.com/demos/. If you have any more questions, don't hesitate to ask after you tried to resolve your problem and after you did some research.

如果以上都回答了您的问题，请将其标记为正确答案.

If all this answered your question, please mark it as correct answer.

这篇关于JQuery 手风琴自动高度问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！