2

ウィンドウのサイズを変更すると、ウィンドウのサイズを確認できます。このように

<script type="text/javascript">

    jQuery(window).resize(function () {
      var width = jQuery(window).width();
      var height = jQuery(window).height();
      console.log(width);
      console.log(height);
    })
</script>

ここで、ウィンドウのサイズを変更するときにドキュメントサイズを取得したいと思います。ウィンドウのサイズを変更するたびにサイズを取得するにはどうすればよいですか。

4

4 に答える 4

6

$（window）.width（）; //ブラウザのビューポートの幅を返します

$（document）.width（）; //HTMLドキュメントの幅を返します

http://api.jquery.com/width/

于 2013-03-07T11:25:14.430 に答える
3

document次のオブジェクトを使用できます。

var width = jQuery(document).width();
var height = jQuery(document).height();

デモ： http： //jsfiddle.net/wyHwp/

ご覧のとおり、ドキュメントのサイズは同じ値ですが、ウィンドウは小さくなっています。ウィンドウがドキュメントに必要なサイズより大きくなると、ドキュメントはウィンドウのサイズに拡大されます。

document.body要素のサイズを取得することもできます。

var width = jQuery(document.body).width();
var height = jQuery(document.body).height();

違いは、ウィンドウが高くてもbody要素の高さを取得できることです。つまり、body要素はウィンドウの下部まで自動的に引き伸ばされません。

于 2013-03-07T11:27:20.957 に答える
2

これが必要かどうかわからない：

jQuery(window).resize(function () {
   var winwidth = jQuery(window).width();
   var winheight = jQuery(window).height();
   var docwidth = jQuery(document).width();
   var docheight = jQuery(document).height();
   console.log('window width is -> ' + winwidth + 'window height is -> ' + winheight);
   console.log('document width is -> ' + docwidth + 'document height is -> ' + docheight);
}).resize();
//-^^^^^^^^----this will log everytime on doc ready
于 2013-03-07T11:37:49.193 に答える
1

サンプルコードを変更して、同時に取得します。

<script type="text/javascript">

    jQuery(window).resize(function () {
      var width = jQuery(window).width();
      var height = jQuery(window).height();
      var documentWidth = jQuery(document).width();
      var documentHeight = jQuery(document).height();
      console.log(width);
      console.log(height);
    })
</script>
于 2013-03-07T11:27:51.217 に答える