7
votes

Comment arrêter toutes les animations précédentes de JQuery avant d'exécuter un nouveau?

Je suis juste en train d'expérimenter quelque chose avec jQuery.

J'ai une image qui s'estompe dans une autre image comme Mouseover () code> se produit et réalise sur mouseout () code>

Cela fonctionne bien, sauf si vous déplacez votre souris sur le lien encore et encore, disons 5 fois, l'image s'efface à plusieurs reprises, 5 fois pendant que vous vous asseyez-vous là et attendez-le à la fin de Avec ce comportement fou. P>

Pour arrêter ce comportement, j'ai essayé d'utiliser un drapeau et de démarrer l'animation uniquement si ce n'est pas déjà animé, mais devine quoi? Si, dites, j'ai 4 boutons de ce type, et sur chaque bouton Mouseover, je ne fais pas de fadadin une image différente, cette animation sera ignorée puisque le drapeau est faux. P>

y a-t-il donc d'arrêter tout le précédent animations avant d'exécuter de nouveaux? Je parle de la normale Fadein () CODE> et SDITEDOWN () CODE> Fonctions dans JQuery P>


Edit: Ajout de code du lien. EM> P>

function mouseOverOut(t)
{
    if(t)
    {
        $('.img1').fadeIn();
        $('.img2').fadeOut();
    }
    else
    {
        $('.img1').fadeOut();
        $('.img2').fadeIn();
    } 
}


1 commentaires

@Patrick GRRRRRRRRR Vous avez exposé mes habitudes de dénomination de la fonction enfantin!


3 Réponses :


1
votes

Avez-vous déjà essayé déjà stop () ?

Description: Arrêtez l'animation actuellement en cours sur les éléments assortis.


1 commentaires

Non, je n'ai pas essayé d'arrêter, est-ce une fonction indépendante? Devrais-je simplement l'appeler comme stop () ? va essayer cela maintenant et faire rapport, merci



1
votes

en utilisant .stop ()


0 commentaires

9
votes

Utilisation de .stop () code> avec Fadein / OUT OUT OUT peut amener l'opacité à rester bloquée dans un état partiel.

Une solution consiste à utiliser . Fadeto () code> à la place, qui donne une destination absolue pour l'opacité. p> xxx pré>

Voici une façon plus courte de l'écrire. P>

function mouseOverOut(t) {
    $('.img1').stop().animate({opacity: t});
    $('.img2').stop().animate({opacity: !t});
}


4 commentaires

L'utilisation du gotoend-argument de STOP () devrait être capable d'éviter cela.


@ Dr.Molle - Oui, c'est une option, mais l'effet est plus jarring à mon avis.


Bien sûr, il devrait être beaucoup mieux si l'animation pourrait se terminer lisse comme si vous suggérez :)


2 ans après que vous ayez donné cette réponse, toujours les gens (bien..Me) l'utilisent! à votre santé!