jQuery CSS Hover

Ich habe ein CSS-Menü, in dem die Farbe des übergeordneten Elements festgelegt wird, wenn der Mauszeiger darüber bewegt wird, und das untergeordnete Element ul (Untermenü). Wenn Sie den Mauszeiger über das Menü halten, ändert sich die Farbe und bleibt so, bis Sie den Mauszeiger über das Menü und dessen Untermenü bewegen. Es sieht gut aus.

Ich habe etwas jQuery-Code hinzugefügt, um die Farbe der Menüelemente zu ändern, bis eine bestimmte Seite geöffnet wird. Diese Menüs werden dann wieder eingeblendet und erhalten wieder Farbe. Warten Sie, bis der Schwebeflug die Farbe ändert.

Das Problem, das ich habe, ist, dass wenn Sie die Farbe mit jQuery wieder in den ursprünglichen Zustand (in CSS festgelegt) zurückversetzen, die Klasse: hover entfernt wird, die verhindert, dass sich die Farbe ändert, wenn Sie mit der Maus darüber fahren, und das Untermenü untergeordnet ist. Irgendwelche Ideen, wie man das behebt? Gibt es einen Selektor mit jQuery, mit dem ich die: hover-Klasse wieder auf normal setzen kann?

/* ---- Menu Colours ---- */
$(document).ready(function()
{
   var colours = ['d50091', 'c8fa00', '00b4ff', 'b158fc', 'ffa800', '00b72f'];
   var counter = 0; // Loop for the colurs
   var status  = 0; // Status of the colours (greyed out or visible)

   $('ul.menu-horiz').children('li').children('a').hover(function()
   {
      $(this).parent()[0].css('color', '#d50091');
   }, function()
   {
      $(this).parent()[0].css('color', '#b6b6b6');
   });

   $('ul.menu-horiz').children('li').children('a').each(function()
   {
      $(this).css({opacity: 0.2, color: '#' + colours[counter]});
      counter++;
   });

   $('.haccordion .header').click(function()
   {
      if (window.location.hash.substr(1) == 'photogallery')
      {
         $('ul.menu-horiz').children('li').children('a').each(function()
         {
            if ($(this).css('opacity') != '1.1')
            {
               $(this).animate({opacity: 1.1}, 1000).css('color', '#b6b6b6');
            }
         });
      }
      else
      {
         counter = 0;
         if ($('ul.menu-horiz').children('li').children('a').css('opacity') != '0.2')
         {
            $('ul.menu-horiz').children('li').children('a').animate({opacity: 0.2}, 1000, function()
            {
               $('ul.menu-horiz').children('li').children('a').each(function()
               {
                  $(this).css('color', '#' + colours[counter]);
                  counter++;
               });
            });
         }
      }
   });
});

Antworten auf die Frage(2)

Ihre Antwort auf die Frage