0

次のような単純な JQuery スクリプトがあります。

$('.pane-hover').mouseenter(function() {
    $(this).children().animate({backgroundColor: "#fff"}, 200 );
});
$('.pane-hover ').mouseleave(function() {
    $(this).children().animate({backgroundColor: "#e4e4e4"}, 200 );
});

これが (Jquery Color を使用して) 行うことは、div にマウスを合わせると背景が白くなり、div を離れると通常の色に戻ります。複数の .pane-hover クラスがあります。

私がやりたいことは、今すぐクリックでアニメーションをアクティブにすることです-divをクリックすると背景が白くなりますが、別のdiv(同じクラス)をクリックすると他のdivが元の色に戻ります。次に、クリックした新しい div を背景白にします。したがって、基本的に、背景が白の div は 1 つだけです。

これを行う方法について何か考えはありますか?

既存の HTML のサンプル:

<div class="pane pane-hover pane-history" id="pane4">
<div class="scroll-pane">
    <div class="title title-empty"></div>
    <div class="scroll-pane-inner">
        <h2>TITLE</h2>
        <p>Text.</p>
    </div>
    <div class="footer-divider"></div>
</div></div>

前もって感謝します!

4

1 に答える 1