CSS pointer-eventsでマウスイベントを無効化する

HTMLでdisableクラスを持った要素のclickとかmouseoverのイベント発生をキャンセルしたい場合がある。
そういうときは、javascriptでイベント拾ってコールバックでfalse返すとか、イベントオブジェクトのpreventDefault()を呼ぶとかする。

でも、CSSで出来るようだ。

.disable{
  pointer-events: none;
}

最近、アニメーションとか複雑なセレクタとか、デザイン以上の事をCSSでできるけど、デバッグがし難いなぁ・・と。

タイトルとURLをコピーしました