jQuery：如何在頁面加載時設置變量，在頁面上調整大小銷燬變量，然後加載新變量？

所以我使用了一些我在網上找到的jQuery。它有很多變化，所有這些都可以幫助您創建相同高度的div。我使用的代碼是這樣的，當我加載一個頁面。jQuery：如何在頁面加載時設置變量，在頁面上調整大小銷燬變量，然後加載新變量？

var highestCol = Math.max($('.equal_height_div1').height(),$('.equal_height_div2').height()); 
$('.equal_height').css('min-height', highestCol);

工程就像一個魅力。

爲了得到這個調整瀏覽器窗口工作時，我從上面重複使用相同的代碼，但只是把它調整大小功能裏面：

$(window).resize(function() { 
var highestCol = Math.max($('.equal_height_div1').height(),$('.equal_height_div2').height()); 
$('.equal_height').css('min-height', highestCol); 
});

這裏的挑戰：我使用的是1140grid與響應式佈局（http://cssgrid.net/）。它在調整窗口大小時調整div的大小。所以我的div的寬度正在縮小，上面的第二組代碼在窗口大小調整時工作得很好。

我遇到的問題，並希望從任何人的洞察力是如何摧毀頁面調整大小的最小高度的值，然後再次運行該功能從最高的div獲得新的最小高度？問題是，一旦div變高，我調整窗口的寬度，div就需要降低高度，但它仍然保持最高的div分高度。這將允許我不斷用新值更新div的最小高度，並重新計算最大div的實際高度。

來源

2012-03-23 flinx777

取消設置最小高度以便div重新計算高度。

$('document').ready(function(){ 

    var $equal_height = $('.equal_height'), 
     $col_a = $('.equal_height_div1'); 
     $col_b = $('.equal_height_div2'); 

    // calc the highest column 
    // we assign this the return value of a function to make sure its always fresh. 
    var heighest = function($col_a, $col_b){ 
     // Cache variables in closure 
     var $col_a, $col_b; 
     // this is where the magic happens 
     return function(){  
      return Math.max($col_a.height(), $col_b.height()); 
     } 
    }($col_a, $col_b); 

    // Run once on ready to equalize columns 
    $equal_height.css('minHeight', heighest); 

    $(window).resize(function(){ 
     // By unsetting minHeight the column gets its real size back 
     $equal_height.css('minHeight', 0) 
      .css('minHeight', heighest); 
    }); 

});

來源

2012-03-24 00:39:03 max

哇......完美。那就是訣竅。日Thnx！現在我只需要給你買一杯啤酒:) – flinx777 2012-03-24 03:12:22

如果我理解你是正確的，你需要刪除min-attribute，如果你縮放寬度。也許這有助於將CSS設置爲以下內容：

.css('min-height', 'none');

也許只是一種解決方法，但也許它的工作原理。

來源

2012-03-24 00:06:24 hyde

jQuery：如何在頁面加載時設置變量，在頁面上調整大小銷燬變量，然後加載新變量？

回答

相關問題