次のような単純な 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>
前もって感謝します!