jQuery Mobile手风琴小部件自动高度不起作用

Question

我正在使用jQuery Mobile手风琴小部件与jQuery 1.7.1版和jQueryMobile 1.1.1版。我希望手风琴在展开时占据一个固定的空间，以便页面的其余部分不会向下滚动，就像这里的演示一样：http://jqueryui.com/accordion/#default

我试过使用jQuery的'accordion'选项，但是看起来他们是不同的。现在，手风琴小组根据内容改变大小，因此手风琴下面的内容不断变化。

这里是我的代码：

<div data-role="collapsible-set"> 
    <div data-role="collapsible"> 
     <h3>Title 1</h3> 
     <p>[content 1: very long]</p> 
    </div> 
    <div data-role="collapsible"> 
     <h3>Title 2</h3> 
     <p>[content 2: normal length]</p> 
    </div> 
    <div data-role="collapsible"> 
     <h3>Title 3</h3> 
     <p>[content 3: short]</p> 
    </div> 
    <div data-role="collapsible"> 
     <h3>Title 4</h3> 
     <p>[content 4: short]</p> 
    </div> 
</div> 

谢谢！

Answer 1

不要将jQuery Ui手风琴与jQuery Mobile手风琴混淆，它们没有任何共同之处。

jQuery Mobile的手风琴可以强制使用固定高度一些CSS改变：

.ui-collapsible-content { 
    height: 50px !important; 
    overflow-y:scroll !important; 
} 

直播的jsfiddle例如：http://jsfiddle.net/Gajotres/YvhLk/

删除溢出-Y：滚动重要;如果你不想要一个滚动条。