フレームを使わず部分的にスクロールエリアを作る
CSSを利用して一部領域のみをスクロール表示する方法を紹介しています。
サンプルコード
<body style="overflow-y:hidden;overflow-x:auto;margin:0">
<table style="width:100%;height:100%" border=0 cellpadding=0 cellspacing=0>
<tr height="50">
<td>
ここは固定される
</td>
</tr>
<tr valign="top">
<td>
<div style="width:100%;height:100%;overflow-y:scroll;margin:0;padding:8">
スクロールする<br><br><br><br><br><br><br>
スクロールする<br><br><br><br><br><br><br>
スクロールする<br><br><br><br><br><br><br>
スクロールする<br><br><br><br><br><br><br>
スクロールする<br><br><br><br><br><br><br>
スクロールする<br><br><br><br><br><br><br>
スクロールする<br><br><br><br><br><br><br>
スクロールする<br><br><br><br><br><br><br>
スクロールする<br><br><br><br><br><br><br>
</div>
</td>
</tr>
<tr height="50">
<td>
ここは固定される
</td>
</tr>
</table>
</body>概要
実際はDynamic HTMLというかスタイルシートの使い方です。
<body style="overflow-y:hidden;overflow-x:auto;margin:0">
として、ページ全体のスクロールバーを消します。
次にテーブルページ全体に定義して、スクロールさせるエリアだけ
<div style="width:100%;height:100%;overflow-y:scroll;margin:0;padding:8"></div>
として、スクロールさせるエリアを囲みます。
この項目の味噌はスタイルシートのoverflow項目です。