HTMLウィンドウmoveBy()メソッド
HTMLウィンドウのmoveBy()メソッドは、現在の座標を基準にしてウィンドウを移動します。
構文
以下は構文です-
window.moveBy(x,y)
ここで、xとyは、ウィンドウを水平方向と垂直方向にそれぞれピクセル単位で移動する値を定義します。
HTMLウィンドウの例を見てみましょうmoveBy()メソッド-
例
<!DOCTYPE html> <html> <style> body { color: #000; height: 100vh; background-color: #8BC6EC; background-image: linear-gradient(135deg, #8BC6EC 0%, #9599E2 100%) no-repeat; text-align: center; } .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; margin: 1rem auto; } </style> <body> <h1>HTML Window moveBy() Method Demo</h1> <button onclick="create()" class="btn">Create new window and then move it</button> <script> function create(){ var newWindow =window.open('','','width=150,height=150'); newWindow.moveBy(550, 200); } </script> </body> </html>
出力
「新しいウィンドウを作成してから移動する」をクリックします 」ボタンをクリックして新しいウィンドウを生成し、moveBy()メソッドを使用してウィンドウを移動します。
-
HTMLウィンドウmoveTo()メソッド
HTMLウィンドウのmoveTo()メソッドは、ウィンドウの左端と上端を指定された座標に移動します。 構文 以下は構文です- window.moveTo(x,y) ここで、xとyは、ウィンドウを水平方向と垂直方向にそれぞれピクセル単位で移動する値を定義します。 HTMLウィンドウの例を見てみましょうmoveTo()メソッド- 例 <!DOCTYPE html> <html> <style> body { color: #000; height:
-
HTML DOMウィンドウstop()メソッド
HTML DOMウィンドウstop()は、ブラウザの停止ボタンをクリックせずにウィンドウのリソースの読み込みを停止する機能をユーザーに提供します。 構文 以下は構文です- window.stop() 例 HTML DOMウィンドウのstop()メソッドの例を見てみましょう- <!DOCTYPE html> <html> <head> <title>HTML DOM Window stop()</title> <style> * { padding: 2