2014.05.14
ある条件でaタグを無効にする必要がありまして、
JavaScriptで出来そうだけど、さてどのようにしようかな・・
と考えつつ検索していたところ、なんとCSSで実現できるとの記事を発見。
YoheiM .NET
[CSS] CSSでJavaScriptのClickイベントやリンククリック時の動作などを禁止する方法
---------------------------
pointer-events : none;
---------------------------
上記のスタイルを指定することで、
aタグの動作や JavaScript の onClick 等のイベントを無効にすることができます。
今回はレスポンシブなサイトで、
・大画面の時はサムネ + LightBox
・スマホ等の小画面では画像100%表示でクリックなし
という用途で使いました。
レスポンシブ案件が今後増えれば、さらに使いどころが出てくるかもしれません。
しかもIE7以上で動くそうなので安心です!
2016.12.15
盛大に間違えていたようで、IEでは11以上から対応でした。
とても便利なスタイルですが、使用する場合は対応ブラウザと相談になりそうです。
ご指摘があり修正しました。
誤った情報を掲載してしまい申し訳ありませんでした。
JavaScriptで出来そうだけど、さてどのようにしようかな・・
と考えつつ検索していたところ、なんとCSSで実現できるとの記事を発見。
YoheiM .NET
[CSS] CSSでJavaScriptのClickイベントやリンククリック時の動作などを禁止する方法
---------------------------
pointer-events : none;
---------------------------
上記のスタイルを指定することで、
aタグの動作や JavaScript の onClick 等のイベントを無効にすることができます。
今回はレスポンシブなサイトで、
・大画面の時はサムネ + LightBox
・スマホ等の小画面では画像100%表示でクリックなし
という用途で使いました。
レスポンシブ案件が今後増えれば、さらに使いどころが出てくるかもしれません。
2016.12.15
盛大に間違えていたようで、IEでは11以上から対応でした。
とても便利なスタイルですが、使用する場合は対応ブラウザと相談になりそうです。
ご指摘があり修正しました。
誤った情報を掲載してしまい申し訳ありませんでした。
IE7以上で動くとはどのソースから?
>Anonymousさん
すみません、対応ブラウザを誤って掲載してしまっていたようです。
本文修正いたしました。