フレーム内のリンク

一番のポイントは、フレーム内でのリンクです!

フレームタグの属性に、name="・・・" がありましたね。
リンクスポットから飛ばすときに、どの画面に表示させるかが大事
そのためにフレームに名前をつけるのです。

そして、リンクタグにフレーム指定をしておく必要があります
つまり、リンクページをどの画面に表示させるかを指定します

・・・フレームタグの属性追加・・・

name="・・・"フレームに名前を付ける
targetで指定
target="・・・"リンクページを表示するフレームを指定
"・・・"にはnameでつけたフレーム名を書く
target="_self"リンクスポットのあるフレームに表示
target="_top"フレームをなくして、画面全体に表示
target="top"新しいウィンドウを開いて表示
target="_blank"次々に新しいウィンドウを開いて表示



No.24のソースを利用してリンクの実験をしましょう

No.28
<html>
<head>
<title>フレーム内のリンク</title>
</head>
<frameset cols="30%,70%">
<frame src="menu28.html" bordercolor="lime" name="menu">
<frame src="main28.html" name="main">
</frameset>
<noframes>
このページはフレームを使って作成しています。<br>
フレームをご覧になれない方にはもうしわけございません・・・ </noframes>
</html>

メニューページと、メインページも必要ですね。

"menu28.html"
<html>
<head>
<title>メニューフレーム</title>
</head>
<body bgcolor="darkseagreen" text="green">
<center>
<font size="+2" color="red"><b>MENU</b></font><br><br>

<a href="a.html" target="main">リンクページ「a.htm」を</a><br>
メイン画面に<br><br>

<a href="b.html" target="menu">リンクページ「b.html」を</a><br>
メニュー画面に<br><br>

<a href="a.html">リンクページ「a.htm」を</a><br><br>

と書くと、どうなるか?<br><br>

</center>
</body>
</html>

"main28.html"
<html>
<head>
<title>メインフレーム</title>
</head>
<body bgcolor="honeydew" text="green">
<center>
<br><br>
<font size="+2" color="darkgreen"><b>サンプルNo.28</b></font><br><br>

メニュー画面が、他の画面に変わっているときに<br><br>
元に戻すリンクを貼っておきます。<br><br>

<a href="menu28.html" target="menu">menu28.htmlを左画面に</a><br><br>

</center>
</body>
</html>

この他に、リンクのために、二つのページ
「a.html」と「b.html」を作っておきましょう

サンプル28はこのように見えますね → frame-28.html



制作者のHPかぼちゃの旅