| ポイント |
<![CDATA[
<frameset rows="40,*">
<frame src="top.html" name="fTop">
<frameset cols="50%,*">
<frame src="left.html" name="fLeft">
<frame src="right.html" name="fRight">
</frameset>
</frameset>
jpURL = new Array("left.html" ,"right.html",
"left2.html","right2.html",
"left3.html","right3.html");
function popJump(selOBJ)
{
n = selOBJ.selectedIndex;
parent.fLeft.location.href = jpURL[n*2 ];
parent.fRight.location.href = jpURL[n*2+1];
}
<select onChange="popJump(this)">
]]>
|
| 説 明 |
セレクトメニューで同時に２つのフレームを入れ替えるには、あらかじめ入れ替えるフレームにname属性で名前を付けておきます。名前を付けたフレームのURLは「parent.フレーム名.location.href」で指定することができます。 |
| サンプル |
<![CDATA[
<html>
<head>
<title></title>
<frameset rows="40,*">
<frame src="top.html" name="fTop">
<frameset cols="50%,*">
<frame src="left.html" name="fLeft">
<frame src="right.html" name="fRight">
</frameset>
</frameset>
</head>
</html>
]]>
|
| 補足説明 |
同時に複数のフレームを入れ替える場合、必ずしもJavaScriptでなければできないわけではありません。HTMLでもフレームを２つに分割し、さらにその１つのフレーム内にフレーム分割するHTMLを読み込めばJavaScriptを使わなくても同時に複数のフレームをハイパーリンク（aタグ）だけで処理することができます。
また、top.htmlの内容は以下の通りです。
<![CDATA[
<html>
<head>
<title></title>
<script Language="JavaScript"><!--
jpURL = new Array("left.html" ,"right.html",
"left2.html","right2.html",
"left3.html","right3.html");
function popJump(selOBJ)
{
n = selOBJ.selectedIndex;
parent.fLeft.location.href = jpURL[n*2 ];
parent.fRight.location.href = jpURL[n*2+1];
}
// --></script>
</head>
<body>
<form>
<select onChange="popJump(this)">
<option>left.html, right.html
<option>left2.html, right2.html
<option>left3.html, right3.html
</select>
</form>
</body>
</html>
]]> |
|
■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!
|
セレクトメニューで同時に２つのフレームを入れ替える