2

マルチレベルのネストされた div があります。各 div にはスパンがあります。

<div>
    <span>AA</span>
    <div>
        <span>BB</span>
        <div>
            <span>CC</span>
        </div>
    </div>
</div>

div をホバーすると、スパン css は別の背景を取得する必要があります。AAスパンを含む最も外側のdivにカーソルを合わせる限り、これはうまく機能します。しかし、問題は、BB スパンを含む中央の div をホバーすると、外側の div もホバーすることです。CCスパンdivにカーソルを合わせると、3つのスパンすべてが背景になります。

私が欲しいのは、マウスが指している 1 つの div だけがホバーされることです。私はできれば CSS ソリューションを探していますが、jQUEry も同様に優れています。

これは、問題の簡略化された jsfiddle です: http://jsfiddle.net/FufRg/

4

3 に答える 3

1

jquery では、これは簡単です。伝播を停止するだけです。 jsフィドル

$("div").on("mouseover",function(e){
    $(this).children("span").css("background","#AAA");
    e.stopPropagation();
});
$("div").on("mouseout",function(){
    $(this).children("span").css("background","");
});
于 2013-10-26T19:50:45.507 に答える
0

このように考えてください。部屋に入るよりも、ベッドに入るよりも家に入ると、あなたはまだ家にいる->部屋にいる->ベッドにいる。ベッドにいるだけ、部屋にいるだけとは言えません。あなたは私の主張を理解していると思います。にカーソルを合わせると、すべてCC divのhoverでトリガーされます。divこれは、既にAA divと の上にあるためですbb div。最良の解決策はdiv、ネストされていない個別の を使用することです。アクイロの言うとおりだ。

于 2013-05-15T08:42:15.547 に答える