: le sélecteur de pointage ne fonctionne pas avec jQuery 1.4

Question

Vous n'avez trouvé rien sur Google. Je parle de CSS: hover, pas jQuery .hover(). Ainsi, le code:

$('#something a:hover').css({'something': 'thomesing'}); 

fonctionne très bien avec 1,3, mais pas avec 1.4. Comment le réparer?

Answer 1

hover changé en 1.4 et pas drôle on semble ici avoir pris la peine de vérifier les docs jQuery ...

$("#something a").hover(
    function() { 
    $(this).toggleClass("active") 
    } 
); 

Changer les couleurs via css.

Note:
Appel $(selector).hover(handlerInOut) est un raccourci pour:

$(selector).bind("mouseenter mouseleave",handlerInOut); 

Answer 2

: l'indicateur n'est pas pris en charge dans jQuery (voir docs).

Cela n'a pas vraiment de sens non plus: les sélecteurs jQuery sont utilisés pour sélectionner des éléments. Que choisirait ": planer"?

Je suis surpris que cela fonctionne même en 1.3

Answer 3

vous pouvez utiliser .hover() fonction ou encore mieux plaine css

Answer 4

Suivez les règles
Ceci est un superbe exemple des raisons pour lesquelles nous devons toujours coder selon la documentation, et non selon les possibilités. Hacks, ou de simples oublis comme celui-ci, seront éventuellement éliminés.

La bonne façon jQuery (vaut mieux css plaine) pour ce faire suit:

$("#something a").hover(
    function() { 
     // $(this).addClass("hovered"); 
     $(this).css("color", "red"); 
    }, 
    function() { 
     // $(this).removeClass("hovered"); 
     $(this).css("color", "black"); 
    } 
); 

Le $.fn.hover method prend jusqu'à deux arguments et sert de sucre syntaxique pour les événements de pointeur plus explicite (souris). En fait, la méthode de vol stationnaire dans jQuery 2.1.0 était rien que ceci:

function(fnOver, fnOut) { 
    return this.mouseenter(fnOver).mouseleave(fnOut || fnOver); 
} 

Comprendre votre code et être concis
Comme vous pouvez le voir, la fonction fnOver est appelée lorsque vous entrez dans l'élément, et encore quand vous sortez (si aucune autre méthode n'est fournie). Grâce à cette compréhension, nous pouvons configurer des instructions plus simples:

$("#something a").hover(function() { 
    $(this).toggleClass("hovered"); 
}); 

natif gagne presque toujours
En fin de compte, CSS de vanille est le chemin à parcourir. Le :hover pseudo-classe a été around for a long time, et travaille avec le ciblage non seulement l'élément auquel il appartient, mais des éléments imbriqués ainsi:

#something a:hover { 
    background: red; 
} 

#something a:hover .icon { 
    animation: 2s rotate ease-out; 
} 

Avec quelque chose d'aussi largement soutenu que :hover, je ne peux penser à rien de bon raison de l'éviter.

Answer 5

: hover n'est pas un sélecteur de pseudo-classe documenté.

Essayez ceci:

$('#something a').hover(function(){ 
          $(this).css({'something': 'thomesing'}); 
         }, 
         function(){ 
          $(this).css({'something': 'previous'}); 
         }); 

Bien que, vous feriez mieux d'utiliser des classes CSS:

$('#something a').hover(function(){ 
          $(this).toggleClass("over").toggleClass("out"); 
         }, 
         function(){ 
          $(this).toggleClass("over").toggleClass("out"); 
         }); 

http://docs.jquery.com/Events/hover

EDIT:

En respose à BlueRaja de commentaire ci-dessous, le fol mugissement serait plus approprié:

$('#something a').hover(function(){ 
          $(this).addClass("over").removeClass("out"); 
         }, 
         function(){ 
          $(this).removeClass("over").addClass("out"); 
         }); 

Answer 6

Pour moi, ce sélecteur ne fait pas beaucoup de sens, car elle dépend d'un événement par l'utilisateur. Les sélecteurs sont plus sur le contenu statique, où la fonction hover() peut suivre un événement. L'utilisateur devrait avoir sa souris au-dessus du contenu quand vous avez fait l'appel.

Il pourrait y avoir des cas où cela serait utile, mais dans le cas que vous avez mentionné, Jonathon Sampson a la bonne réponse. Utilisez $("#something a").hover(function() {$(this).css("something","thomesing");}); à la place.

Answer 7

Je ne pense pas que cela fonctionne dans 1.3. Comme l'a mentionné Philippe, cela n'a aucun sens.

: survol est un événement, pas un attribut. Donc, je ne vois pas comment ce sélecteur pourrait fonctionner.

Vous pouvez soit utiliser la fonction de vol stationnaire comme mentionné antpaw - http://docs.jquery.com/Events/hover#overout

ou vous pouvez définir une règle de style CSS. par exemple.

$('head').append("<style type='text/css'>#something:hover{foo: bar}</style>"); 

Answer 8

Comment fonctionne jQuery est qu'il parse sélecteurs (que ce soit ou normal css), puis retourne l'objet jQuery. À ce jour, jQuery ne supporte pas le sélecteur ': hover'. Il pourrait fonctionner dans Chrome ou FF ou Safari, mais échouera certainement dans IE6, 7 et 8.

Une solution de contournement serait d'utiliser la méthode hover() de jQuery.

Dans les cas plus complexes, vous souhaitez enregistrer les gestionnaires d'événements mouseenter et mouseleave sur le conteneur que vous voulez sélectionner avec ': hover', et ajouter/supprimer la classe '.hover'. Une fois que la classe régulière 'hover' est là, vous pouvez facilement accéder à cet élément conteneur à partir de n'importe où dans le code en utilisant le sélecteur '# container.hover'.

Laissez-moi savoir si vous avez besoin d'aide pour coder cette ...