Jquery / Javascript Подменю Color Hover

Question

У меня есть другая проблема в выпадающем меню jquery.

В моем примере (ссылка внизу) я хочу, чтобы при наведении курсора на подуровень 3 уровня текстовый цвет текущего элемента подменю оставался в состоянии наведения (например, желтый цвет).

Пример ссылки на Live с полным кодом

У меня есть комментарии в коде, чтобы объяснить, где проблема.

Спасибо

Answer 1

I обновил вашу скрипку здесь , чтобы устранить проблему.

Я переместил наведение с ul.submenu li a на просто ul.submenu li, чтобы когда его подменю2 зависало над ним, оно не 'вызвать функцию unhover.Затем я применил стили в функциях к тегам .children('a'), например:

$('ul.submenu li').hover(function() {
    $(this).children('a').css({
        color: '#eff803'
    });

    $(this).find(".submenu li:first a").stop().animate({
        backgroundColor: '#0d0167'
    });
}, function() {
    $(this).children('a').css({
        color: '#ffffff'
    });

    $(this).find(".submenu li:first a").stop().animate({
        backgroundColor: '#0000FF'
    });
});

Answer 2

для начала, избегайте css() там, где можете.вам лучше использовать addClass() и removeClass().определите класс наведения, который содержит нужные вам цвета (при условии, что ваше меню не находится внутри другого <ol> или <ul>), используйте что-то вроде

$('.menu a').hover(function() {
  var $path = $(this).parents('li').find('> a').not(this);
  $(this).closest('.menu').find('a').not($path).removeClass('hover');
  $path.addClass('hover');
  //code that animates to the colours in your hover class
  $(this).addClass('hover').css('');//make it stick
});

edit: извините, не думал о исчезновении встилей