JavaScriptのwindow.resizeTo・resizeByとは?ウィンドウサイズを変更する方法を初心者向けに解説
window.resizeTo() と window.resizeBy() は、ブラウザウィンドウのサイズを変更するためのメソッドです。
指定した幅・高さに変更したり、現在のサイズから相対的に変更したりできます。
window.resizeToとは?(絶対サイズに変更)
window.resizeTo(width, height) は、ウィンドウのサイズを指定した幅・高さに変更します。
- 幅(px):ウィンドウの横幅
- 高さ(px):ウィンドウの高さ
ブラウザによっては、ツールバーや枠のサイズを含むかどうかが異なるため、
実際の表示領域が完全に一致しない場合があります。
使用例:指定サイズに変更
→ ウィンドウ subWin を幅400px、高さ400pxに変更します。
window.resizeByとは?(相対的にサイズ変更)
window.resizeBy(dx, dy) は、現在のウィンドウサイズに対して指定した分だけサイズを増減させます。
- 正の値:サイズを大きくする
- 負の値:サイズを小さくする
使用例:現在のサイズから変更
→ 現在のウィンドウを横に50px、縦に100px大きくします。
注意点
- ブラウザの設定により、ウィンドウサイズ変更が制限される場合がある
- ユーザー操作を妨げないよう、過度なサイズ変更は避けるべき
- ポップアップウィンドウでの利用が一般的
まとめ
resizeTo():指定した絶対サイズに変更resizeBy():現在のサイズから相対的に変更- サイズはピクセル単位で指定する
- ブラウザによって動作が制限される場合がある