Blog

メニューバーの画像を全部つなげた１枚だけ作成し、ロールオーバーはcssのbackground-potisionで行う技。
↓こういう画像を用意して、動作指定はサクっとcssでやっちゃうやつです。

便利ですよね。メリットとしては

• 画像が１枚で済む
• マウスオーバーでの読み込み時に一瞬白くなるチラツキがなくなる
• jsを使わなくて済む
• htmlコードがシンプルになる

いや～良いことずくめだ。

上の画像は「通常」と「マウスオーバー」の２種類だけですが、当然のごとくわき出る要望として

「今いるページの部分だけはリンクをはずして色を変えたい」

↓こういうことですよね。

でもでも！これをWordPressで実装しようと思うと、ある問題に引っかかります。
WordPressではテーマファイル内のheader.phpにメニューバーの記述をしている場合がほとんどなので
すべてのページに同じメニューバーが表示されちゃいます。

そこで使うのが条件分岐

はい、サクッとコード書きます。

(さらに…)