Activer/désactiver le style de survol au moment de l'exécution ?

Question

Dans mon css, j'ai ceci :

#panel li:hover {
  background-color: #ffa;
}

sous certaines conditions, je voudrais désactiver le style de survol des éléments li, quelque chose comme.. :

function start() {
    $('#panel li').ignoreHoverRules();
}

et le réactiver plus tard :

function end() {
    $('#panel li').reenableHoverRules();
}

Est-ce que quelque chose comme ça est possible ? Je ne suis pas sûr de savoir comment "activer" ou "désactiver" les règles de style de survol au moment de l'exécution,

Gracias

Answer 1

Le moyen le plus simple de le faire est d'ajouter une classe à votre fichier <li> éléments :

#panel li.allowHover:hover {
  background-color: #ffa;
}

function start() {
    $('#panel li').removeClass("allowHover");
}
function end() {
    $('#panel li').addClass("allowHover");
}

Sinon, la manipulation des règles CSS devient très délicate. ce n'est pas une tâche facile .