2010-04-21 6 views
0

J'ai donc une chaîne d'animation (.animate(). Animate(). Animer()), et le dernier .animate(), il y a un rappel pour faire un peu de nettoyage. L'animation est déclenchée par le hachage dans le changement d'adresse (# page1, # page2, etc.) - donc quand l'utilisateur change rapidement l'état de l'historique, s'il y a une animation en cours d'exécution, il doit s'arrêter ils ne font pas la queue. Le problème est que, si j'ajoute un .stop (true, true), il apparaît uniquement pour passer à la fin de l'animation en cours d'exécution - et exécute seulement son callback, s'il y en a un. Ce dont j'ai besoin, c'est de sauter à la fin de toutes les animations enchaînées, et de déclencher tous les rappels (enfin, juste le dernier).jQuery chaînes .animate, callbacks et .stop (true, true)

Est-ce possible en quelque sorte? Un grand merci.

+0

Je suis curieux de voir une chaîne d'animation dans la nature ... a un exemple? –

+0

Il y a une démo sur la page API ... c'est l'exemple avec les boutons "Animate Block 1" et "Animate Block 2": http://api.jquery.com/animate/ – JKS

Répondre

1

La réponse est très simple. Merci à JacobM pour l'inspiration.

(function($){ 
    $.fn.extend({ 
     hardStop: function(){ 
      return this.each(function(){ 
       var e = $(this); 
       while (e.queue().length){ 
        e.stop(false, true); 
       } 
      }); 
     } 
    }); 
})(jQuery); 

$("#element").hardStop();

modifier tardive: J'ai remarqué que sur les chaînes d'animation complexes, il est nécessaire de vous assurer que la réalisation d'un rappel ne pas ajouter plus de fonctions à la file d'attente fx d'un élément déjà « effacé » (donné que plusieurs éléments sont inclus dans le sélecteur d'origine):

(function($){ 
    $.fn.extend({ 
     hardStop: function(){ 
      var stopped = false 
      while (!stopped) { 
       this.each(function(){ 
        var e = $(this); 
        while (e.queue().length){ 
         e.stop(false, true); 
        } 
       }); 
       stopped = true; 
       this.each(function(){ 
        var e = $(this); 
        if (e.queue().length){ 
         stopped = false; 
        } 
       }); 
      } 
     } 
    }); 
})(jQuery); 

Je sens cette solution pourrait être plus simple ...