HTML編 33/51
| 目的別 index | タグ別 index | カラーチャート | images | SAMPLE |
フレームで画面を分割する
スクロールバーの表示・非表示
境界線を固定する




スクロールバーの表示・非表示

●<FRAME SRC="n" SCROLLING="n">
今作った上下に分割したフレームは、上のフレーム部分に内容が全て入りきらないので、上フレーム右側にスクロールバーが現れたと思います。もちろんこのような場合、スクロールバーがないと目的のボタンへアクセスできないのですが、デザインによってはこのスクロールバーが不要なこともあります。
<FRAME SRC>に続けてSCROLLINGオプションを加えると、このスクロールバーの表示・非表示を指定できます。必ず表示させたい場合はパラメータにyes、絶対表示させたくない場合はnoを入れます。ブラウザに入りきらない場合のみ表示させたい場合はautoです。デフォルトはautoですので、先ほどの上下に分割した例は自動的にスクロールバーが付きました。この「SCROLLING」オプションタグは<FRAME SRC>ごとに入れられるので、上の(右の)フレームにはスクロールバーを付けて、下の(左の)フレームには付けない、といった指定も可能です。「no」を指定する場合、小さな画面で見ている人でも、必ず内容が全て表示されるレイアウトを組まないと、全て見てもらえませんのでご注意を。
上のフレームのスクロールバーを消して、下のフレームにはスクロールバーを表示してみます。
View
<HTML>
<HEAD>
<TITLE>Kimura's Room:Profile</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=Shift_JIS">
</HEAD>

<FRAMESET ROWS="30%,70%">

<FRAME SRC="menu.html"
SCROLLING="no">
<FRAME SRC="contents.html"
SCROLLING="yes">

</FRAMESET>
</HTML>




境界線を固定する

●<FRAME SRC="n" NORESIZE>
左右に分割したフレームに話を戻します。現在、フレームとフレームの間に境界線が表示されていますね。この境界線をマウスでドラッグしてみて下さい。境界線が動いてしまいます。せっかく<FRAMESET COLS〜>で170ピクセルと指定したにも関わらず、見ている人に動かされてしまってはこちらの意図したデザインと違う物が表示されてしまいます。そこで、境界線を動かなくするタグです。FRAME SRCに続けてNORESIZEと書き込みます。ここは2分割ですので境界線は1本ですから、どちらか片方のFRAME SRCに書き込めばOKです。
View
<HTML>
<HEAD>
<TITLE>Kimura's Room:Profile</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=Shift_JIS">
</HEAD>

<FRAMESET COLS="170,*">

<FRAME SRC="menu.html"
NORESIZE>
<FRAME SRC="contents.html">

</FRAMESET>
</HTML>

backindexnext