JQUERY UI Accordion調整窗口大小？

Question

我使用jQuery UI手風琴模塊：

<script type="text/javascript"> 
$(function() { 
    $("#sidebar_column_accordion").accordion({ 
     fillSpace: true, 
     icons: { 'header': 'ui-icon-plus', 'headerSelected': 'ui-icon-minus' } 
    }); 
}); 
</script> 

通過使用fillSpace選項，手風琴佔據了我想要的窗口的整個高度。問題是它計算頁面加載的高度，如果用戶調整其瀏覽器，它不會調整...

有沒有辦法讓瀏覽器窗口調整大小時手風琴重新計算高度/大小？

由於

Answer 1

$(window).resize(function(){ 
    $("#sidebar_column_accordion").accordion("resize"); 
}); 

在jQuery UI的1.9除去大小調整方法。刷新方法增加了，這更加健壯，並且在這種情況下也可以工作。

$(window).resize(function(){ 
    $("#sidebar_column_accordion").accordion("refresh"); 
}); 

Answer 2

它看起來像這樣已經更新到 「刷新」

$(function() { 
$("#accordion").accordion({ 
heightStyle: "fill" 
}); 
}); 
$(function() { 
$("#accordion-resizer").resizable({ 
minHeight: 140, 
minWidth: 200, 
resize: function() { 
$("#accordion").accordion("refresh"); 
} 
}); 
}); 

Answer 3

集autoHeight：手風琴decalaration '內容'。這將使格使用內容的原始高度：

$('#accordion').accordion({ 
    autoHeight: 'content' 
}); 

這裏看到更多的信息：http://jqueryui.com/accordion/#no-auto-height

Answer 4

發佈對我來說沒有工作的其他解決方案，但他們接近。

使用heightStyle定義你的手風琴：填寫，就像這樣：

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

創建一個函數來計算並設定高度。請注意，我必須同時做這兩件事，設置高度，然後在手風琴上調用刷新。沒有其他人就無法工作。

function calculateHeight(){ 
    var height = $('#maincontent').height(); // Or whatever height you want 
    $('#sidebar_column_accordion').height(height); 
    $('#sidebar_column_accordion').accordion("refresh"); 
} 

在頁面加載和窗口調整大小調用此函數。

calculateHeight(); 

$(window).resize(function() { 
    calculateHeight(); 
});