2013-11-14 18 views
0

我需要的是在手風琴中只有一個div(設備屬性)將高度更改爲內容。我還注意到,如果我去螢火蟲,並刪除設備div的高度屬性,它會收到良好的高度。jQuery手風琴heighstyle:內容或填充不工作

我的手風琴開始:

$('#accordion').accordion({heightStyle: 'auto'}); 

我想:

$('#accordion').accordion({heightStyle: "fill"}); 
$("#accordion").accordion("refresh"); 

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

我需要什麼: What i need

HTML示例(所以你有一個想法)

<div id="application" style="position:absolute"> 
<div id="accordion" class="ui-accordion ui-widget ui-helper-reset" role="tablist"> 
<h3 id="clickTexts" class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all ui-accordion-icons" role="tab" aria-controls="ui-accordion-accordion-panel-5" aria-selected="false" tabindex="-1"> 
<span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span> 
Texts 
</h3> 
<div id="ui-accordion-accordion-panel-5" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="overflow: auto; display: none; height: 246px;" aria-labelledby="clickTexts" role="tabpanel" aria-expanded="false" aria-hidden="true"> 
<span class="ui-helper-hidden-accessible" role="status" aria-live="polite"></span> 
<input id="texts_ac" class="ui-autocomplete-input" type="text" onclick="this.value='';" autocomplete="off"> 
</div> 
<h3 id="clickDevp" class="ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-accordion-header-active ui-state-active ui-corner-top" role="tab" aria-controls="device" aria-selected="true" tabindex="0"> 
<span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-s"></span> 
Device properties 
</h3> 
<div id="device" class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="width: 278px; display: block; height: 246px;" aria-labelledby="clickDevp" role="tabpanel" aria-expanded="true" aria-hidden="false"> 
ID: 
<input id="devID" type="text" style="float:right"> 
<hr> 
<p id="devType">Type: BLOK6-097</p> 
<hr> 
<p> 
<hr> 
<p>Positions</p> 
<div id="posTable"> 
<table border="1px" style="width:100%"> 
<tbody> 
<tr> 
<td>1</td> 
<td>NORMAAL</td> 
<td>X: Y:</td> 
</tr> 
<tr> 
<td>2</td> 
<td>MAX. 110 IN DISCORDANTIE</td> 
<td>X: Y:</td> 
</tr> 
<tr> 
<td>3</td> 
<td>MAX. 90 IN DISCORDANTIE</td> 
<td>X: Y:</td> 
</tr> 
<tr> 
<td>4</td> 
<td>MAX. 70 IN DISCORDANTIE</td> 
<td>X: Y:</td> 
</tr> 
<tr> 
<td>5</td> 
<td>MAX. 50 IN DISCORDANTIE</td> 
<td>X: Y:</td> 
</tr> 
<tr> 
<td>6</td> 
<td>PIJL IN DISCORDANTIE</td> 
<td>X: Y:</td> 
</tr> 
<tr> 
<td>7</td> 
<td>PIJL LINKS IN DISCORDANTIE</td> 
<td>X: Y:</td> 
</tr> 
<tr> 
<td>8</td> 
<td>EINDE SNELHEID IN DISCORDANTIE</td> 
<td>X: Y:</td> 
</tr> 
<tr> 
<td>9</td> 
<td>KRUIS IN DISCORDANTIE</td> 
<td>X: Y:</td> 
</tr> 
</tbody> 
</table> 
</div> 
</div> 
</div> 

回答

0

因此很明顯, $( '#DIV設備')。CSS( 「高度」, 「」) 的伎倆