調整動態元素使用jQuery這裏不正常

Question

看看我的問題：

http://jsfiddle.net/89sq2/

什麼應該發生的是，幾個月傳說應該適合在底部。如果您手動調整窗口大小（導致它觸發適當的事件處理程序），會發生這種情況，但不會在第一次加載頁面時執行。你能弄清楚爲什麼？

謝謝！

Answer 1

最後，我找到了一個工作解決方案。在佈局完成後手動觸發調整大小事件。看看這裏，並隨時aport更好的代碼：

http://jsfiddle.net/89sq2/19/

謝謝大家！

Answer 2

您確定頁腳的高度，但它變得更寬和更短的後設置寬度網頁

Answer 3

看看這個

http://jsfiddle.net/89sq2/8/

Answer 4

這很奇怪。我認爲這是在調整大小功能的問題..不論出於什麼原因，它不會，當我一旦稱呼它工作..兩次不產生相當的結果，但3次工作：

$(function() { 
    $(document).ready(function() { 
    var resize; 
    $('.interval-view').wrapInner('<div class="column" />'); 
    $('.column').wrapInner('<div class="inner-column" />'); 
    $('#contents, #footers').append('<div class="clearfix"></div>'); 
    $('.interval-view:even').css('background-color', '#F9F9F9'); 
    $('.interval-view:odd').css('background-color', '#DDD'); 
    $('#footers').css('background-color', '#CCC'); 
    resize = function() { 
     $('.column').height($(window).height() - $('#filter-list').outerHeight(true) - $('#footers').outerHeight(true)); 
     $('#timeline-panel').width($(window).width()); 
     return $('#timeline-panel .scrollable-area').width("" + ($('.interval-view').length * $('.interval-view').width()) + "px"); 
    }; 
    window.onorientationchange = function() { 
     return resize(); 
    }; 
    $(window).resize(function() { 
     console.log("Resizing"); 
     return resize(); 
    }); 

     $(window).resize(); 
     $(window).resize(); 
     $(window).resize(); 
    }); 
}); 

我們在手動調整窗口大小時沒有看到問題，因爲事件在調整大小的過程中多次被觸發（想想在調整大小時每次您的鼠標移動一個像素時都會觸發它）。你可以看到它住在這裏http://jsfiddle.net/89sq2/14/