JQuery анимировать, если класс не является .active

Question

Я пытаюсь анимировать цвет фона моей навигации, который я могу заставить работать с

$(".mainNav li a").hover(function () {
    $(this).stop().animate({ backgroundColor: "#EF4D23" }, 500);
}, function () {
    $(this).stop().animate({ backgroundColor: "#303030" }, 500);
});

. То, что я хочу сделать дальше, это только делать эту анимацию, если класс тега - нет.активный, поэтому я пытаюсь:

$(".mainNav li a").hover(function () {
    if ($(this).not(".active")) {
        (function () {
            $(this).stop().animate({ backgroundColor: "#EF4D23" }, 500);
        }, function () {
            $(this).stop().animate({ backgroundColor: "#303030" }, 500);
        });
    }
});

Но он ничего не делает или выдает ошибку.

Спасибо за любую помощь.

Answer 1

Вы хотите использовать .is() вместо .not() (.not() будет фильтровать элементы, .is() возвращает логическое значение в зависимости от того, соответствует ли оно селектору)

$(".mainNav li a").hover(function () {
    if (!$(this).is(".active")) {
       (function () {
            $(this).stop().animate({ backgroundColor: "#EF4D23" }, 500);
        }, function () {
            $(this).stop().animate({ backgroundColor: "#303030" }, 500);
        });
     }
});

Answer 2

попробуйте следующее:

    $(".mainNav li a").not(".active").hover(function () {
...code    
    });

Answer 3

if ($(this).not('active').length > 0) {