Comment désactiver le survol d'un lien? J'utilise li: hover

Question

J'essaie de désactiver la fonctionnalité de survol pour un menu.
Je veux que ce soit activé seulement dans certaines conditions.
J'ai essayé d'utiliser $(".ulColor").removeClass('hover');, mais cela n'a pas fonctionné
Le code CSS pour permettre le vol stationnaire est:

li:hover ul, li.over ul { display: block; }

Voici la DIV HTML à l'intérieur duquel le menu réside -

<div id="pColorSelectorDiv" class="parentOfAll"> 
    <ul id="colorNav" class="ulColor"> 
     <li id="liColorNav" ><a id="colorSelected" class="firstAnchorChild">Colors</a> 
      <ul id="ulColorChild" class="ulColor"> 
       <li><a id="bkgColor-1" class="bkgColor-1 anchorClass" name="colorPallete" onclick="colorPicked('1');">COLOR</a></li> 
       <li><a id="bkgColor-2" class="bkgColor-2 anchorClass" name="colorPallete" onclick="colorPicked('2');">COLOR</a></li> 
       <li><a id="bkgColor-3" class="bkgColor-3 anchorClass" name="colorPallete" onclick="colorPicked('3');">COLOR</a></li> 
      </ul> 
     </li> 
    </ul> 
</div> 

Voici le reste du code CSS:

div[id="pColorSelectorDiv"] ul { 
    margin: 0; 
    padding: 0; 
    list-style: none; 
    width: 50px; /* Width of Menu Items */ 
    border-bottom: 1px solid #ccc; 
    } 

div[id="pColorSelectorDiv"] ul li { 
    position: relative; 
    } 

.firstAnchorChild{ 
    display: block; 
    text-decoration: none; 
    color: #777; 
    background: White; /* IE6 Bug */ 
    padding: 5px; 
    border: 1px solid #ccc; /* IE6 Bug */ 
    border-bottom: 0; 
    cursor: pointer; 
    } 


li ul { 
    position: absolute; 
    left: 49px; /* Set 1px less than menu width */ 
    top: 0; 
    display: none; 
    background: White; 
    } 


/* Styles for Menu Items */ 
.anchorClass{ 
    display: block; 
    text-decoration: none; 
    color: #777; 
    background: White; /* IE6 Bug */ 
    padding: 5px; 
    border: 1px solid #ccc; /* IE6 Bug */ 
    border-bottom: 0; 
    cursor: pointer; 
    } 

.bkgColor-1 {background: #00FFFF; color: #00FFFF;} 
.bkgColor-2 {background: #0000FF; color: #0000FF;} 
.bkgColor-3 {background: #7FFF00; color: #7FFF00;} 

Answer 1

Je pense que vous voulez

li.hover:hover ul { display: block; } 

au lieu de

li:hover ul, li.over ul { display: block; } 

Maintenant, ce style affectera ul seulement quand li est plané et a hover classe.

A simplified example. PS Vous pouvez également utiliser le bouton 'code sample' sur le formulaire d'édition (celui avec des zéros et des uns) pour formater votre code. Entre autres choses, il va préserver l'indentation (et donc augmenter la lisibilité). La combinaison de touches est ctrl+K. J'ai modifié l'un de vos exemples de code pour le démontrer.