固定ヘッダーメニュー

やりたかった事は、

・6つぐらい異なるドメインのページがある

・似たような用途なのでそれぞれに遷移できるリンクをつけたい

・現在開いている場合はリンクさせない

・一つ前のページに戻るリンクをつけたい

というもの。

一つ一つ書いていくのはメンテや拡張の際に

面倒なことになるのでヘッダーメニューを作ってみようと思い、

調べて作ったんでメモ。

■参考サイト

http://www.css-lecture.com/log/css/047.html

■ソース

<?
extract($_REQUEST);
?>
<style>
div#header{
width: 100%;
background: #000 ;
border-bottom: 1px solid #CCC;
color: #FFF;
padding: 3px;
position: fixed; //コンテンツの固定
top:0;
left:0;
}
* html div#header{
position: absolute;
top: expression(eval(document.documentElement.scrollTop+0));
}
div#header h3 {
width: 800px;
margin: 0 auto;
}
div#header h3 a {
color: fff;
}
</style>
<div id="header">
<h3>
<? echo ($now_url == 1) ? 'リンクA' : '<a href="http://www.aaa.com">リンク</a>';?> /
<? echo ($now_url == 2) ? 'リンクB' : '<a href="http://www.bbb.com">リンク</a>';?> /
<? echo ($now_url == 3) ? 'リンクC' : '<a href="http://www.ccc.com">リンク</a>';?> /
<? echo ($now_url == 4) ? 'リンクD' : '<a href="http://www.ddd.com">リンク</a>';?> /
<? echo ($now_url == 5) ? 'リンクE' : '<a href="http://www.eee.com">リンク</a>';?> /
<? echo ($now_url == 6) ? 'リンクF' : '<a href="http://www.fff.com">リンク</a>';?> /
<a href="javascript:history.back();">■前のページに戻る</a>
</h3>
</div>

■使い方

上記ソースが書いてあるファイルのパスをhttp://www.aaa.com/header.phpとする。

メニューをつけたいページに

<? include('http:www.aaa.com/header.php?now_url=●●'); ?>

●●はメニューをつけたいページの番号を振っておく。

now_urlをクエリで投げて、extractで受け取って

現在のページをリンクさせないようにしている。

もうちょっとスマートなやり方もありそうだけど、

とりあえずはこれ以上思いつかなかった。