évènements: fonction mouseleave

Déclenche une fonction qui se déclenche lorsque l'évènement mouseleave est déclenché.


La différence avec mouseout, vient du fait que l'évènement mouseout est déclenché à chaque fois que le pointeur se déplace vers ou à partir d'un élément fils, a l'inverse de mouse leave, qui ne se déclenche qu'une fois lorsque le pointeur quitte l'élément en cours.
Il faudra que le curseur se déplace a nouveau dans l'élément puis en ressorte pour que l'évènement mouseleave soit a nouveau déclenché.


Version: disponible depuis la version 1.0 de JQuery

Paramétres:

  • fn (fonction): fonction éxécutée lorsque l'évènement mouseleave sera déclenché

Valeur de retour: object jQuery

Exemple :

Montre la différence entre mouseleave et mouse out, par le biais de compteurs qui s'incrémente a chaque fois que l'évènement est déclenché.

    var i = 0;
    $("div.overout").mouseout(function(){
      $("p:first",this).text("mouse out");
      $("p:last",this).text(  i);
    }).mouseover(function(){
      $("p:first",this).text("mouse over");
    });

    var n = 0;
    $("div.enterleave").mouseenter(function(){
      $("p:first",this).text("mouse enter");
    }).mouseleave(function(){
      $("p:first",this).text("mouse leave");
      $("p:last",this).text(  n);
    });

Code de test: 

<div class="out overout"><p>move your mouse</p><div class="in overout"><p>move your mouse</p><p>0</p></div><p>0</p></div>
<div class="out enterleave"><p>move your mouse</p><div class="in enterleave"><p>move your mouse</p><p>0</p></div><p>0</p></div>

0 Commentaire (afficher/poster)