グローバルナビゲーションって、どうやって作るんですか。

質問

グローバルナビゲーションって、サイトのページ全部に表示されていて、ページ移動のときも再読み込みされてないふうに視覚的にみえますよね。
あれはどのようにして、作られているのでしょうか。いろんな技術を使って実現できると思うのですが、できるだけ多くの手法を知りたいです。

・html
・css
・php
・javascript

などを使った、たくさんの手法を教えてください。よろしくお願いします。上記以外の言語でもかまいません。

回答No.2

asamixxx

PHPやSSIであれば、グローバルナビゲーションの部分だけを別ファイルに切り出して、各HTMLでインクルードすれば可能です。

回答No.1

三郷北 M君（@mkun55555）

カテゴリがABCの３つの場合

■テキストだけの方法
★HTMLファイル
<div id="GlobalNavi"><ul>
<li><a href="aaa">Aカテゴリ</a></li>
<li><a href="bbb">Bカテゴリ</a></li>
<li><a href="ccc">Cカテゴリ</a></li>
</ul></div>を基本とし、
Aカテゴリ内のHTMLファイルは
<li><a href="aaa">Aカテゴリ</a></li>→
<li>Aカテゴリ</li>に変える。
★CSSファイル
#GlobalNavi li {display: inline;}

■画像を使う方法
★HTMLファイル
<div id="GlobalNavi"><ul>
<li><a href="aaa"><img src="aaa.gif"alt="Aカテゴリ" /></a></li>
<li><a href="bbb"><img src="bbb.gif"alt="Bカテゴリ" /></a></li>
<li><a href="ccc"><img src="ccc.gif"alt="Cカテゴリ" /></a></li>
</ul></div>を基本とし、
Aカテゴリ内のHTMLファイルは
<li><a href="aaa"><img src="aaa.gif"alt="Aカテゴリ" /></a></li>→
<li><a href="aaa"><img src="aaa2.gif"alt="Aカテゴリ" /></a></li>に変える。