ウィンドウを移動するスクリプトです。
(例:ボタンのクリックでサブウィンドウを移動させる)
■メインウィンドウのソース
<html> <head> <title>HTML index Webサイト</title> <script type="text/javascript"> <!-- function disp(url){ window.open(url, "window_name", "width=350,height=250,scrollbars=yes"); } // --> </script> </head> <body> <p><a href="example_sub11.html" target="window_name" onClick="disp('example_sub11.html')">サブウィンドウを開く</a></p> </body> </html>
■サブウィンドウのソース
<html> <head> <title>HTML index Webサイト</title> <script type="text/javascript"> <!-- function change(move){ if(move == 'top'){ // 上に移動 window.moveBy(0, -20); // (左右 , 上下) } else if(move == 'left'){ // 左に移動 window.moveBy(-20, 0); // (左右 , 上下) } else if(move == 'right'){ // 右に移動 window.moveBy(20, 0); // (左右 , 上下) } else if(move == 'bottom'){ // 下に移動 window.moveBy(0, 20); // (左右 , 上下) } } // --> </script> </head> <body> <p> <input type="button" value="↑上" onClick="change('top')"> <br> <input type="button" value="←左" onClick="change('left')"> <input type="button" value="右→" onClick="change('right')"> <br> <input type="button" value="↓下" onClick="change('bottom')"> </p> </body> </html>
上記の例は、まずメインウィンドウ内のリンクでサブウィンドウを開き、そのサブウィンドウをボタンのクリックで移動させています。
※サブウィンドウを開くときの設定については、「サブウィンドウを開く」を参考にしてください。
【サブウィンドウ内の説明】
<head> 〜 </head> 内にスクリプトを記述しておき、ボタンのクリックでスクリプトを実行します。
サブウィンドウの移動は、
window.moveBy(0, 0)
この部分で指定しています。
moveBy() … 現在の位置から相対的に移動する指定
0, 0 … 左が左右の指定、右が上下の指定
正数の場合は右方向または下方向の移動、マイナスの場合は左方向または上方向の移動になります。以下を参考にしてください。
window.moveBy(0, -20) … 上に 20 移動
window.moveBy(-20, 0) … 左に 20 移動
window.moveBy(20, 0) … 右に 20 移動
window.moveBy(0, 20) … 下に 20 移動
この例の場合、クリックするたびに 20 ずつ移動することになります。
数値を大きくするほど、一回の移動量は大きくなります。
青い文字の部分は、必要に応じて書き換えてください。