window.resizeBy とは
- ここで説明する window とは次の語句からなる JavaScript のグローバル変数であり、Window オブジェクトを参照します。
- window
- 読み: ウィンドウ
意味: 窓
- ここで説明する resizeBy とは次の語句からなる JavaScript のメソッドです。
- resize
- 読み: リサイズ
意味: サイズを変更する - by
- 読み: バイ
意味: ~によって
window.resizeBy メソッドの概要
このメソッドは、引数に与えたピクセル値で、現在のウィンドウを差分でリサイズします。
ただし、これは全てのウィンドウをリサイズできるわけではありません。 リサイズできるのは window.open() により、単独で開かれたウィンドウのみです。
構文
サンプルを見る前に構文を確認しておきます。
window.resizeBy(x_Differential, y_Differential)
- x_Differential: 横幅の差分値です。ピクセル単位で指定します。
- y_Differential: 縦幅の差分値です。ピクセル単位で指定します。
サンプルコードと実行結果
ここでは、2つのボタンを配置しています。
まず、ウィンドウ.オープン のボタンをクリックして単独のウィンドウで、このページを開いてください。 次に、単独のウィンドウで開いたページの ウィンドウ.リサイズ のボタンをクリックしてください。
ウィンドウ.リサイズ をクリックする度に、ウィンドウの縦横の幅が 50 ピクセルずつ狭まっていきます。 なお、概要のところでも述べていますが、このメソッドは単独のウィンドウでしか機能しません。
サンプルコード: HTML
<body>
<button onclick="funcWindowOpen()"> ウィンドウ.オープン </button>
<hr style="margin: 3em 0;">
<button onclick="funcResizeBy()"> ウィンドウ.リサイズ </button>
<script>...</script>
</body>
- 02: button (このボタンをクリックすると funcWindowOpen() 関数を呼び出します。)
- 04: button (このボタンをクリックすると funcResizeBy() 関数を呼び出します。)
サンプルコード: script
<script>
function funcWindowOpen(){
window.open("ファイル名", null, "width=650, height=600, left=200, top=200");
}
function funcResizeBy(){
window.resizeBy(-50, -50);
}
</script>
- 02-04: funcWindowOpen() (この関数は 03 行目のコードりより、新しい単独のウィンドウを開きます。)
- 05-07: funcResizeBy() (この関数は 06 行目のコードにより、ウィンドウをリサイズします。)