メニューを常に表示する
<title>メニューを常に表示する</title>
<script language="JavaScript">
<!--
function setMenu(){
var menuTable = fixMenu;
var dBody = document.body;
menuTable.style.pixelLeft = 10 + dBody.scrollLeft;
menuTable.style.pixelTop = 20 + dBody.scrollTop;
}
// -->
</script>
</head>
<body onLoad="setMenu()" onResize="setMenu()" onScroll="setMenu()">
<table width="237" id="fixMenu" style="position:absolute;" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" bgcolor="#009999" align="center">
<img src="special_title.gif" width="237" height="34" alt="特集 WebARENA Suite2活用術"><br>
<a href="http://www.salut.ne.jp/special/10/index.html"><img SRC="special10.gif" width="217" height="95" border="0" alt=" 番外編 SuitePROって何だろう？"></a><br>
<img src="special_bn.gif" width="237" height="46" alt="バックナンバー"><br>
<table width="215" border="0" cellspacing="0" cellpadding="5">
<tr>
<td style="font-size:12px; line-height:1.5em;">
<a href="http://www.salut.ne.jp/special/9/index.html">９）データベースを活用しよう！</a><br>
<a href="http://www.salut.ne.jp/special/8/index.html">８）Suite2でBlogを始めよう！</a><br>
<a href="http://www.salut.ne.jp/special/7/index.html">７）メール自動返信を使う！</a><br>
<a href="http://www.salut.ne.jp/special/6/index.html">６）Webメールを使う！</a><br>
<a href="http://www.salut.ne.jp/special/5/index.html">５）グループウェアを使う！</a><br>
<a href="http://www.salut.ne.jp/special/4/index.html">４）ダウンロードスペースを作る！</a><br>
<a href="http://www.salut.ne.jp/special/3/index.html">３）メーリングリストを使う！</a><br>
<a href="http://www.salut.ne.jp/special/2/index.html">２）アクセスログを解析する！</a><br>
<a href="http://www.salut.ne.jp/special/1/index.html">１）会員制エリアを作る！</a><br>
<a href="http://www.salut.ne.jp/special/0/index.html">０）Suite2入門・再入門</a></td>
</tr>
</table>
<img src="special_bottom.gif" width="237" height="10"></td>
</tr>
</table>
ページをスクロールしてもメニューは固定されています。<br>
</body>
</html>
ページの特定の位置にメニューを固定するJavaScriptです。
縦長のページで、スクロールしても常にメニューを表示したいが、フレームを使いたくないというときに便利です。
<head></head>内に上記JavaScriptを記述します。
<body>にonLoad="setMenu()" onResize="setMenu()" onScroll="setMenu()"を記述します。
常に表示させたいメニューをテーブル組みにして、そのテーブルタグ（<table>）にid="fixMenu" style="position:absolute;"を記述します。
表示させたい位置は、<head></head>内の
menuTable.style.pixelLeft = 10 + dBody.scrollLeft;
（左から10ピクセルの位置に配置）
menuTable.style.pixelTop = 20 + dBody.scrollTop;
（上から20ピクセルの位置に配置）
で、数字を変更して調整します。
ホームページ作成ガイド
ホームページ作成ガイド