メニューをつくって、CSSでロールオーバーをやっていると、そのページに移ったときはそのページへのリンクメニューはロールオーバーしないようにCSSを追加したりするんだけど、ページがやたら多くてテンプレート使いたくなると手作業でやるのが面倒にならないだろうか?
それで同じファイル名のスタイルシートを自動で適用するJavaScriptを作ってみた。
css-change.jsのソース
// ここから
var url = document.location.href;
var sa = url.split("/");
var name = sa[sa.length-1];
var sty = name.replace(/\.html/,"");
document.write("<link rel=\"stylesheet\" href=\""+sty+".css\">");
// ここまで
htmlファイルのヘッダーに以下を挿入
<script type="text/javascript" charset="Shift_JIS"
src="css-change.js"></script>
これで例えばaaa.htmlというファイルなら、同じディレクトリ内のaaa.cssが自動で適用される。
んじゃないかな?たぶんね(JavaScriptは詳しくないので弱気)
コメントする