cssのopacity:0とdisplay:noneの違い。隠れ方にもいろいろあるのか・・。
2016
17
こんにちは。
こちらのショップにカテゴリを追加したい記事でopacity:0だとクリックできないと書いてました。
すみません。できます。すでに訂正しておきました。
隠れ方にもいろいろあるんですね～。
これ完全に勘違いしてました。
opacityは透明になるだけで、クリックもhoverも効くんですね。
要素自体は存在しているわけです。
対してdisplay:noneは本当に存在が消えます。
クリックもできないし、マウスが上に載ってもhoverが働くことはありません。
しかし、ラジオボタンなどはlabelで関連付けておけばしっかり働きます。
あくまでディスプレイ上からなくなるだけなんですね。
今回のミスで、cssも奥が深いなぁと実感しました。
それでは。
こちらのショップにカテゴリを追加したい記事でopacity:0だとクリックできないと書いてました。
すみません。できます。すでに訂正しておきました。
隠れ方にもいろいろあるんですね～。
opacityは見た目が透明になるだけ
これ完全に勘違いしてました。
opacityは透明になるだけで、クリックもhoverも効くんですね。
要素自体は存在しているわけです。
display:noneはディスプレイ上から存在が消える
対してdisplay:noneは本当に存在が消えます。
クリックもできないし、マウスが上に載ってもhoverが働くことはありません。
しかし、ラジオボタンなどはlabelで関連付けておけばしっかり働きます。
あくまでディスプレイ上からなくなるだけなんですね。
今回のミスで、cssも奥が深いなぁと実感しました。
それでは。