jquery - ウィンドウのサイズ変更時にdivの最大高さを変更する方法は?

Question

私は答えを求めて高低を探してきました。私はここでいくつかのことを読みましたが、誰も私がやりたいことに対する解決策を持っていないようです. ウィンドウのサイズが特定のポイントに達したときに、div の最大高さのサイズを変更したいと考えています。メイン メニューはページの下部にあり、コンテンツはメニューから上にスライドして表示されます。

私が持っているものの例:

<div class="content">
    //some content pics/text etc.
</div>

CSS:

.content { width: 550px; overflow: auto; }`

明らかに、現在 css で max-height を設定できますが、画面サイズが高さ 800px に達するまで有効にする必要はありません。ここで簡単なものが不足している場合はお知らせください。

私は jQuery または css ルールを使用することにオープンです。

Answer 1

$(window).on('resize', function(){
    if($(this).height() <= 800){
        $('.content').css('max-height', '800px'); //set max height
    }else{
        $('.content').css('max-height', ''); //delete attribute
    }
});

Answer 2

例があります：http://jsfiddle.net/sechou/WwpuJ/

$(window).resize(function () { 
   if($(window).height() <= 800){
       $('div.content').css('max-height', 800);
   }else{
       $('div.content').css('max-height', ''); 
   }  
});