1

Je suis nouveau sur Prototype JS (et javascript en général), et j'essaye de faire apparaître une superposition après que l'utilisateur a survolé un élément de la page pendant une demi-seconde. À l'heure actuelle, je suis avec l'accomplissement de cette:Prototype JS: passage de la souris avec minuterie?

$$("a.tag").invoke('observe', 'mouseover', function() { 
//my code here 
}); 

Ce code permet la superposition apparaît lorsque l'élément déclencheur est sur moucheté, mais comment puis-je ajouter la demi-seconde pause?

Merci pour toute aide que vous pouvez me donner!

Répondre

2

Faites ceci:

var timerId; 

$$("a.tag").invoke('observe', 'mouseover', function() { 
    timerId = setTimeout(function() { 
    // code here 
    }, 500); 
}); 

$$("a.tag").invoke('observe', 'mouseout', function() { 
    if (timerId) { 
    cancelTimeout(timerId) 
    timerId = null; 
    } 
}); 
+0

Salut Martin, merci pour la réponse. Je voulais faire quelque chose de légèrement différent ... au lieu d'ajouter une pause d'une demi-seconde, je voulais déclencher la fonction si la souris avait survolé l'élément pendant plus de 0,5 seconde. Avec le code ci-dessus, une superposition apparaîtra toujours si je passe la souris sur un élément, disons 0,1 seconde, elle sera simplement retardée. Une idée sur la façon de vérifier la durée de la souris sur l'élément? – Rohan

+0

Désolé, je suis bête, je comprends maintenant. Je vais travailler sur quelque chose et éditer mon post :) –

2

Je pense que vous pouvez ajouter une classe waitingEndDelay à votre élément. Ensuite, codez votre "show function" afin d'être exécuté uniquement si l'élément n'a pas de classe waitingEndDelay. À la fin du délai, supprimez waitingEndDelay.

+0

La fonction show n'est pas appelée après expiration du délai, donc cela ne fonctionnerait pas. –