一番のポイントは、フレーム内でのリンクです!
フレームタグの属性に、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かぼちゃの旅
|