divを動的にサイズ変更するjQuery

Question

私は、CSSライブラリのbootstrap v2.3にあるtwitterのメディアサムネイルを使用しています。あなたは、私がここで働いているかを見ることができます：http://beanstalkwebsolutions.com/portfolio-overview

ここで私が使用しているjQueryのです：各サムネイルは異なる高さを持っていたと私はすべて等しくなるようにそれらを望んでいたので、

<script> 
$(window).load(function() { 
    var maxHeight = 0; 
    var divs = jQuery(".thumbnail"); 
    jQuery.each(divs, function() { 
     var height = jQuery(this).height(); 
     if (maxHeight < height) maxHeight = height; 

    }); 
    divs.css('min-height', maxHeight + 'px'); 
}); 
$(window).resize(function() { 
    var maxHeight = 0; 
    var divs = jQuery(".thumbnail"); 
    jQuery.each(divs, function() { 
     var height = jQuery(this).height(); 
     if (maxHeight < height) maxHeight = height; 

    }); 
    divs.css('min-height', maxHeight + 'px'); 
}); 
</script> 

を基本的に私の目標でしたこのスクリプトは、ロード時にCSSのすべての最小高さを与え、サムネイルの高さが最も高いものに基づいて画面がリサイズされるたびに表示されます。

私はすべてうまくいきましたが、私が理解できない問題は、スクリーンをより小さい/より大きなサイズにドラッグし、最小の高さが非常に大きくなるときです。彼らはサムネイルのdivの見方が大きすぎるので、高さです。誰も私のためのコード提案を持っているので、divはすべて同じ高さですが、大きすぎることはありませんか？

そして、あなたは分の高さではなく高さ CSSプロパティを設定している場合、テキストの段落は、divの外に拡張終わるので、解決策は、私の本来の目的のために動作しません。ウィンドウで

Answer 1

あなたはこのように、再びのdivの分の高さを設定することができますサイズを変更： -

$(window).resize(function() { 
    if($(window).height() < 300){ 
    $("div").css({min-height: 300px}); 
} else { 
    $("div").css({min-height: 600px}); 
} 
});