ウィンドウサイズを変更して要素を拡大する方法

固定サイズからフリーフローに「Webアプリケーション」（つまり、「Webページ」ではなく、ビジネスアプリケーションのライン）を書き換えようとしています。ウィンドウサイズを変更して要素を拡大する方法

これまでのこのアプリケーションは1024x768で修正されましたが、アプリケーションの幅と高さの両方を拡大する必要があります。

divsなどの設定幅= 100％は、幅の問題を解決します。しかし、私たちは身長に問題があります。

javascriptソリューションを探していますが、表示されているブラウザウィンドウの残りの部分を特定の要素で埋めるように指定する必要があります。また、ウィンドウのサイズ変更でこれを続けます。

ブラウザ要件：Internet Explorer 6.0以上（Firefoxなどは問題ありません）。

通常、画面の下部には何らかの種類のグリッドがあります。これは今日の固定高さとオーバーフロー：autoで指定されています。スタイルを使用して、必要に応じてスクロールバーを表示させます。

HTML：：

私のようなものを探しています。このような

.. 
..lots of other elements 
.. 
<div id="bottomGrid" style="width: 100%; height: 200px; overflow: auto;"> 
    I wish this grid would grow with the screen size. 
</div>

そして呼び出す何か：100％それ：

<script language="javascript" type="text/script"> 
    MakeElementGrowWithWindowSize('bottomGrid'); 
</script>

私は高さ設定を試してみました動作しません。 DoctypeをXHTMLからHTML4に変更すると、他にもたくさんのものが壊れてしまいますので、これを巧妙なjavascript（jqueryは問題ありません）で解決することを本当に願っています。

いつものように、私たちは急いでいて、少しの時間とお金を費やしている+これは "巨大な"アプリケーションです。 HTMLやスタイルの書き換えは本当にオプションではありません。

出典

2011-04-07 Paaland

以下の線に沿って何かが動作します、しかし、あなたは、あなたのdivや体のパディングのための手当を作るために、このコードを修正する必要があります。

$(document).ready(function() { 
    $(window).resize(function() { 
     $("#bottomGrid").css({width: $(this).width() + 'px', height: $(this).height() + 'px'}); 
    }); 
});

また、サイドノートとして、あなたは100％の高さになりたい1以上のDOM内のすべての要素がそれらの高さを持っている必要があること、HTMLに純粋に取り組んで100％の高さを取得することが可能となる注意点があることセット。

出典

2011-04-07 10:57:35