liタグaタグでメニューを作っているような時、ある状態の時だけリンク無効にしたい。という要望がよく来る。
jsとか使ってもいいんだけど、面倒だしcssだけできることが多いのでcssでごまかし対応。
◆カーソルをノーマルカーソルにするだけ
cursor: default;
◆メニューを無効っぽく見せる
背景画像の時には
opacity:0.5; filter:alpha(opacity=50);で薄くしたり、 無効時の薄い画像を作って background-positionでずらして表示。
◆cssの機能でaタグイベントを無効に
pointer-events:none; で無効にする。ただしcss3なので、IE6-8とかでは効かない。
これらを上手く組み合わせて無効っぽく見せる。
