[jquery] Gestione eventi: mouseleave() e mouseenter()

[Antonio Milo]

Salve a tutti,

ho un problema nella gestione di un animazione con gli handler mouseleave() e mouseenter().

Nello specifico i miei elementi sono:

-1 <div class="box"> con un'immagine di sfondo
-1 <div class="over"> con colore di sfondo (semi-trasparente) ed inizialmente dislay:none;

quello che volevo è che al passaggio con il mouse su ".box" venga visualizzato ".over". Lo script che ho utilizzato è:

 $("div.box").mouseenter(
          function()
            {
              $(this).children(".over")
              .show("slide", {direction: "down"} ,500)
            }
          )
        .mouseleave(
          function()
            {
              $(this).children(".over")
              .hide("slide", 500).stop(false,false)
            }
          );

Il tutto va decentemente eccetto per il fatto che se passo su ".box" ed esco prima del completamento dell'animazione "show", mouseleave() non viene eseguito e ".over" rimane visibile.

Grazie a chiunque ne sa piu di me xD

[cavicchiandrea]

Ciao e benvenuto,

$("div.box").mouseenter(
          function()
            {
              $(this).children(".over")
              .stop().show("slide", {direction: "down"} ,500)
            }
          )
        .mouseleave(
          function()
            {
              $(this).children(".over")
              .stop().hide("slide", 500).stop(false,false)
            }
          );

ho aggiunto lo stop prima del azione