我正在努力完成以下任务:
<div id="accordion">
<% i = 0 %>
@handle_paises.each do |pais|
@handle_publi_pais = Paquete.paque_pais(pais.id_pais)
if !@handle_publi_pais.blank? %>
<h3><a href="#"><%= pais.nombre %></a></h3>
<div class="section">
<table border="0" cellspacing="0" cellpadding="0" id="paque_tr_5">
<%@handle_publi_pais.each do |pais_cargado|%>
<tr>
<td width="71%" align="left" valign="top" id="paque_tr_1">
<%= pais_cargado.nombre_promocion.to_s %>
</td>
<td width="10%" align="center" valign="bottom" id="paque_tr_3">
<a href="xxx" title="yyy">
<img src="yyy" width="26" height="18" border="0"/>
</a>
</td>
</tr>
<% i += 1 end%>
</table>
</div>
<% end%>
</div>
然而,每个部分都呈现一个巨大的高度(添加我不知道如何(并且不,这个类在任何css文件上都没有任何条目)
为什么会这样?
Thanxxx
更新:
这是
的输出<div class="section ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="height: 663.6px;" role="tabpanel">
这是JSFIDDLE:http://jsfiddle.net/GaqLZ/2/
答案 0 :(得分:2)
heightStyle:“fill”是您正在寻找的属性。
$( "#accordion" ).accordion({ collapsible: true, heightStyle: "fill" });
答案 1 :(得分:1)
我相信你要找的是autoHeight选项:
$(function() {
$("#accordion").accordion({autoHeight: false, collapsible: true});
});
autoHeight
默认为true,并使所有div的大小相同。所以它寻找最高的那个,并为每一个使用那个高度。 autoHeight: false
使每个div都与其内容一样高。
如果您希望各个节点在打开后能够关闭,可以添加collapsible: true
属性。