インラインフレームのリンク指定
インラインフレームに表示するサイトURLを変更する方法について見ていきましょう。 JavaScriptを用いると、 インラインフレーム内のURLを自由に変更できます。 ただし他人のサイトを表示するのはご法度なので、 あくまで自分のサイト内のページに留めておきましょう。
リンク変更のサンプル
ではHTMLのヘッダーに、以下のように記入してみて下さい。
<script>
function ifr(jpURL){
waku.location = jpURL;
}
</script>
次いで、body内に以下のソースを書き込みましょう。
<a href="JavaScript:ifr('http://pori2.net/puzzle/')">
パズルの部屋へ
</a>
<br>
<iframe src="http://pori2.net/" name="waku"
width="100%" height="80%"></iframe>
サンプル（別窓）
サンプルをご覧下さい。最初はうちのサイトのTOPページが表示されていますが、 「パズルの部屋へ」というリンクを押すと、パズルの部屋が表示されますね。 インラインフレーム内のリンク先が変更されたからです。
リンク変更の仕組み
では上記のソースを詳しく見ていきましょう。
最初は関数ifrの宣言をしています（関数名はiframeの略号のつもり）。 引数jpURLを指定し、ここにリンク先を記入するようにしています。
関数内は１行だけです。最初のwakuというのは、 インラインフレームのname属性で指定した値です。 該当のインラインフレームのリンク先（location）に、jpURLを指定します。 locationをlocation.hrefにしてもＯＫです。
あとはaタグ内で関数ifrを呼び出して、 引数にパズルの部屋のURLを指定してやっています。 クリックすると、パズルの部屋に飛びます。