中級編１４

　メニューをフレーム構造で
　　　メニューページの２分割フレームと３分割フレームを習得。

画面にメニューを表示したままリンク先を見せるのはフレーム構造の得意技。 まずは、見本を見ましょうか。　●ココをクリック●して下さい。（ちゃんと戻ってきましょうね）

こういうフレームの場合はＨＴＭＬ文が画面の数だけ必要です。最低限３つに加えてリンク先の数が必要。 サンプルではリンク先が３つでしたから、見て頂いたサンプルでは６つのＨＴＭＬ文を使っています。
　① 1.html フレーム宣言文　：　ここにアクセスしてもらう訳ですね。
　② 2.html 左サイドのメニュー文　：　今回のサンプルは左右分割フレームでした。
　③ 3.html 右サイドに表示させる文　：　リンク先表示用の枠に最初だけ写すページ。
　④⑤⑥リンク先ページ　：　今回はメニューが３つでしたのでリンク先も３つ。
では、①のＨＴＭＬ文（1.html）を見てみましょう。

<html>
<frameset cols="130,*">
　　<frame SRC="2.html" NAME="one">
　　<frame SRC="3.html" NAME="two">
</frameset>
</html>
ここでのポイントは COLS と NAME です。
COLS が左右分割で、ROWS が上下分割です。COLS=の数値が幅のサイズですね。 ROWS=と書けば縦幅のサイズとなります。
NAME= では縦または横に分割した枠に名前を付けた訳です。名前を付けておかないと、リンク先など ページを表示させる場所が決められませんからね。NAMEには、タグで使われるような言葉は避けておくのもポイントですね。

次に左のフレームに表示させるメニュー用ＨＴＭＬ文（2.html）は下記の通りです。

<html>
<BODY bgcolor=000033 link=ffffff vlink=ffffcc>
<br>
<A HREF="1.html" target="two">１ばん</a><br><br>
<A HREF="2.html" target="two">２ばん</a><br><br>
<A HREF="3.html" target="two">３ばん</a><br><br>
<A HREF="〇〇〇.html" target="_top">戻る</a><br><br>
</BODY>
</html>
フレームの宣言で NAME= で付けた名前を、今度は TARGET= で指定する訳です。 フレーム宣言で左にメニュー、右にリンク先表示と決めた通りに指定することが重要です。

戻る時は TARGET="_top" と書いて、フレームなしの状態にブラウザを掃除して戻りましょう。 これは現在のブラウザをフレーム構造など解除してリンク先を表示する時のTARGETです。
主たるTARGET値を説明しておくと
target="_blank" 新規のウィンドウを開いてリンク先を表示
target="_self" 自分自身のウィンドウにリンク先を表示
target="_parent" フレームを1段分割解除して親フレームにリンク先を表示
target="_top" フレーム構造を全て解除してリンク先を表示
以上のような動作になります。基本として覚えておきましょう。

さてさて、フレームの横分割（cols）と縦分割（rows）を組み合わせたら、どうなると思いますか。 そうです、３分割のフレームが出来上がります。
サンプルをご覧下さい。●ココをクリック●して確認しましょう。
上の方でダンディ版とレディ版を選んで、下の左で番号を選びます。例えば、上の方で写真の趣味と絵画の趣味を選んでもらって、 下の左側で動物と植物と風景を選ぶなど。ページの使い方に幅が生まれますね。

いろいろアイデアが出てきましたか。ここまで理解されたらこの項は完璧に修了でーす。
質問メール　 SCHOOL MENU