JavaScriptのサンプル
ウィンドウを移動するスクリプトです。
(例:ボタンのクリックでサブウィンドウを移動させる)
コード
<html>
<head>
<title>TAG index Webサイト</title>
<script type="text/javascript">
<!--
function disp(url){
window.open(url, "window_name", "width=300,height=200,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>TAG 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,
… 左に 20 移動0
)window.moveBy(20,
… 右に 20 移動0
)window.moveBy(0,
… 下に 20 移動20
)
この例の場合、クリックするたびに 20 ずつ移動することになります。
数値を大きくするほど、一回の移動量は大きくなります。
青い文字の部分は、必要に応じて書き換えてください。