jQuery : IsMouseOver - tester si la souris survol un objet

by MACK Mathieu 14. octobre 2011 20:27

Comment savoir si la souris survol actuellement un objet dans votre page ?

Comme il n'existe pas de propriété IsMouseOver, il va s'agir de rajouter une propriété sur l'objet à tester, propriété que l'on pourra relire par la suite au besoin :

On rajoute donc une propriété sur notre objet au survol, valeur que l'on modifie lorsque la souris le quitte :

 

$("#identifiantDeLObjetASuivre").hover(
  function() { $.data(this, 'hover', true); },
  function() { $.data(this, 'hover', false); }
 ).data('hover', false);

 

Et maintenant, pour tester si la souris survolle l'objet :

 

if($("#identifiantDeLObjetASuivre").data('hover'))
{
    // La souris survole bien notre objet.
}

J'ai eu besoin de traiter ces cas pour gérer des timers différents pour des menus déroulants :

Sur un menu déroulant horizontal, j'avais besoin que les sous menus s'ouvrent après un certain délai de x secondes au passage de la souris, mais pas lorsque l'on déplacait la souris sur le menu, là les sous menus devaient s'ouvrir immédiatement.

Si vous avez eu recours à d'autres solutions pour ce genre de problèmes n'hesitez pas à m'en faire part.

Les commentaires sont clos