1

フィドルはここにあります。

HTML:

    <div style="background-color: blue">
        <a style="margin-left: 30px;" href="#" class="avatar currentHover2" ><img      class="avatar_img" alt="" src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcScGVKjsfovuONBaVL4frlyX0KkryNdsigEeCk_EMdowWBj25eN"  style="padding: 10px;">    </a>
        <a style="margin-left: 30px;" href="#" class="avatar currentHover2" ><img class="avatar_img" alt="" src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcScGVKjsfovuONBaVL4frlyX0KkryNdsigEeCk_EMdowWBj25eN" style= "padding: 10px;">    </a>
    </div>

jQuery:

    $(".currentHover2").hover(function () {
        $(this).addClass('magictime puffIn');
    });

CSSファイルが長くて面倒

4

2 に答える 2

2

クラスを削除するように指示することはないため、次のように効果が再び実行されます。

$(".currentHover2").hover(function () {
    $(this).addClass('magictime puffIn');
}, function() {
    $(this).removeClass('magictime puffIn');
});

または、最初にクラスを追加し、クラスが既に存在するため、次回ホバーしても何も変化しません。

于 2013-06-22T20:45:49.870 に答える
2

の後のclassonを削除する必要があります。mouseouthover

試す

$(".currentHover2").hover(function () {
    $(this).addClass('magictime puffIn');
}).mouseout(function(){
 $(this).removeClass('magictime puffIn');
});;

働くフィドル

于 2013-06-22T20:46:55.457 に答える