ウィンドウサイズを取得する場合jQueryやjavascriptで書く方法はそれぞれあります。
今回はウィンドウサイズする書き方を紹介していきたいと思います。
ウィンドウサイズを取得する方法
javascriptの書き方
/* javascriptでウィンドウサイズを取得する */
let in_w = window.innerWidth;
let in_h = window.innerHeight;
let out_w = window.outerWidth;
let out_h = window.outerHeight;
document.write('<h2>javascriptでウィンドウサイズを取得した場合</h2>');
document.write('<p>ウィンドウの表示領域の幅：' + in_w + '</p>');
document.write('<p>ウィンドウの表示領域の高さ：' + in_h + '</p>');
document.write('<p>ブラウザ外側の幅：' + out_w + '</p>');
document.write('<p>ブラウザ外側の高さ：' + out_h + '</p>');window.innerWidth/window.innerHeight
スクロールバーなどを除いたウィンドウの幅と高さを取得したい場合は「window.outerWidth」と「window.outerHeight」で取得できます。
window.outerWidth/window.outerHeight
スクロールバーを含むウィンドウの幅と高さを取得したい場合は「window.innerWidth」と「window.innerHeight」で取得できます。
jQueryの書き方
/* jQueryでウィンドウサイズを取得する */
let win_w = jQuery(window).width();
let win_h = jQuery(window).height();
jQuery('.win').html('<h2>jQueryでウィンドウサイズを取得した場合</h2><p>ウィンドウの表示領域の幅：' + win_w + '</p><p>ウィンドウの表示領域の高さ：' + win_h + '</p>');jQuery(window).width() / jQuery(window).height()
jQueryでウィンドウサイズを取得したい場合は「.width()」と「.height() 」を使います。
javascriptの「innerWidth」と同じようにスクロールバーを除いたウィンドウサイズを取得します。
コメント