1

サイトの流動的なレイアウトを作成しようとしていますが、問題は、ページが読み込まれる前にウィンドウのサイズが変更され、ウィンドウが最大化された場合、ページのサイズが小さいことです。私の質問はどのようにページが小さい場合でも、ウィンドウの幅と高さをフル サイズで取得できますか。

$(document).ready(function()
{
    var Height = $(document).height();
var Width = $(document).width();
});

これにより、ウィンドウの高さと幅が得られます。ウィンドウが小さくても最大サイズが必要です。

4

4 に答える 4

1

実際に行う必要があるのは、ウィンドウのresizeイベントをリッスンし、必要に応じてコンテンツを再配置することです。

または、最新の方法で CSS メディア クエリを使用します。

@media all and (max-width:480px) {
    /* styles for when the window is less than or equal to 480px wide */
}
于 2013-02-16T19:11:33.003 に答える
1
var Height = $("html").height();
var Width = $("html").width();

を試すこともできますがbody、ブラウザに依存する場合もあります。特別に配置された要素が体を越えて伸びる可能性があると私は信じています.

于 2013-02-16T19:12:38.220 に答える
0

画面サイズが必要な場合は、 と を使用screen.widthしてくださいscreen.height

「ウィンドウの境界線」を差し引くことができるので、有用な領域が得られます。

screen.width - (window.outerWidth - window.innerWidth)

そして身長も同じ。

于 2013-02-16T19:19:39.547 に答える
0

ウィンドウのサイズ変更イベントをリッスンする方法の例を次に示します。

HTML:

<body>
    <p>Resize result window to see updated dimensions</p>
    Dimensions: <div id="debug"></div>
</body>

JavaScript:

function updateSize() {
    var $win = $(window);
    $('#debug').html($win.height() + ' x ' + $win.width());
}

$(window).resize(updateSize); // listen for window resize
$(updateSize); // call on page load to get initial size

jsFiddle で試してみてください: http://jsfiddle.net/TKAFc/

于 2013-02-16T19:16:50.583 に答える