0

段落タグにいくつかのテキストを含む div (class="boxes") がいくつかあります。私が望むのは、ホバーしない限りテキストが見えないようにすることです。

しかし、物事は奇妙な振る舞いをしています。私が使用すると: .boxes p{visibility:hidden;} .boxes p:hover{visibility:visible;} テキストは非表示になりますが、ホバーしても表示されません。

私が試したとき: .boxes p{visibility:visible;} .boxes p:hover{visibility:hidden;}
テキストは (しばらくすると) 消えますが、カーソルが移動すると「点滅」します。

ここで何が起こっているのか分かりますか?Firefox は自動的に更新されることが多いので、最新バージョンを実行していると思います。

ありがとう!

4

1 に答える 1

0

ボックスを非表示にすることで、セレクターはそれらの一致を停止し、ボックスが表示されるようになり、元のセレクターが再びそれらに一致するようになり、無限ループからちらつきが発生します。

ボックスを引き続きホバー可能にしたい場合は、別の親要素を指定して非表示にします。

.boxes .parent:hover p {
    visibility: hidden;
}

または、ホバー時にボックスの不透明度をゼロにします。

.boxes p:hover {
    opacity: 0;
}
于 2013-04-01T04:04:04.080 に答える