HTMLやCSSには、ユーザーインタラクション(ユーザー操作)を無効化するための方法がいくつか存在します。たとえば、マウスやタッチ操作を無効化したいときはCSSでpointer-events:noneを要素に指定するなど、制御したいユーザー操作によってさまざまです。
inert属性と呼ばれる無効化対応が一発で可能な属性。
これまた超便利。例えばグレーゾーン(操作できない領域)を作るときにこれまではそれぞれの操作できるタグ(aタグやinputタグなど)にそれぞれ操作をできなくするものを追加しないといけなかった。
ところがこいつはどうだ。一個入れれば全てが操作できなくなるではないか。なんと素晴らしい。注意としては領域内は操作できなくなるから操作したい部分を外に出して作らないと行けない場合があるが、それを省いても便利な機能だ。
ちなみにcssでは
[inert] {}
のような記載でいけるっぽい。 今後使う時があると思うのでメモしておく。















