問題與jquery自動高度divs與移動設備

我目前使用的CSS網格系統開發移動設備的網站。問題與jquery自動高度divs與移動設備

我有一個問題，我會有3到4個功能區/ divs /框與背景顏色，他們似乎是不均勻的取決於每個內容，所以我得到了一個jQuery腳本等於高度，做一個做得好。

$('#plans').each(function() { //CONTAINER DIV CLASS 

     var highestBox = 0; 
     $('.pad', this).each(function() { //EACH PANEL CLASS 

      if ($(this).height() > highestBox) 
       highestBox = $(this).height(); 
     }); 

     $('.pad', this).height(highestBox); 


    });

我的問題/問題是當用戶在平板電腦，當他們從縱向改爲橫向jQuery的高度測量不無刷新整個頁面讓他們重疊，並做各種醜陋的東西調整，是否有更好/不同的方式來實現平等的高度div，可以調整代碼，也考慮到這是一個CMS的支持，所以用戶可以改變每個盒子的內容量，所以我不能設置一個最小高度。

來源

2014-02-09 webmonkey237

你可以聽的window.resize事件

先用功能

$(function() { 
    function resizeHandler(){ 
     $('#plans').each(function() { //CONTAINER DIV CLASS 

      var highestBox = 0; 
      $('.pad', this).each(function() { //EACH PANEL CLASS 

       if ($(this).height() > highestBox) 
        highestBox = $(this).height(); 
      }); 

      $('.pad', this).height(highestBox); 


     }); 
    } 

    resizeHandler(); // call for once when DOM is ready; 
});

包裝您的代碼然後resize事件到此處理綁定。

window.onresize = resizeHandler; // this is the binding

編輯：我想我可以補充一點：在第一負載則應手動調用resizeHandler功能一次

我改變了代碼和校驗this jsbin

來源

2014-02-09 22:14:12 Lupus

嘿，我以爲我有這個工作，結果不是那麼多，你能否請解釋正確的方法來「然後將resize事件綁定到這個處理程序。」謝謝 – webmonkey237

你可以使用.resize()方法將處理程序綁定到調整大小 JavaScript事件：

$(window).resize(function() { 
    var highestBox = 0, 
     plansHeight = $('#plans').height(); 

    $('.pad', '#plans').each(function() { //EACH PANEL CLASS 
    if (plansHeight > highestBox) highestBox = plansHeight; 
    }); 

    $('.pad', '#plans').height(highestBox); 
}).resize(); // Call the handler by default

來源

2014-02-09 22:16:04 Mimi

問題與jquery自動高度divs與移動設備

回答

相關問題