2012-08-09 13 views
5

En primer lugar, jQuery Transit rocks. Si no lo ha visto, consulte http://ricostacruz.com/jquery.transit/ y sorpréndase.jquery transit animation y .stop() fx queue

Sin embargo, un problema es que aunque dice utilizar la cola de efectos de jQuery, y parece en su mayor parte, no puedo utilizar el método .stop() de jQuery para trabajar con él.

He publicado un violín aquí: http://jsfiddle.net/nicholasstephan/sTpa7/

Si hace clic en el botón animado, un estándar de jQuery .animate() se utiliza para mover lentamente el cuadro de la derecha. Tocar detener, como es de esperar, detendrá la animación. Al presionar Restablecer también se detendrá la animación y se volverá a poner la caja donde comenzó.

Si hace clic en la transición, se debe hacer exactamente lo mismo ... pero no es así ...

lo que está pasando aquí? Alguien sabe una solución para esto?

Gracias.

+0

Estoy buscando una solución al mismo problema. ¿Has probado el código en: https://github.com/rstacruz/jquery.transit/issues/18? –

+0

No lo he intentado. Buen hallazgo Me estoy escapando con el uso de una antigua animación jQuery para mi animación que debe detenerse por ahora, pero definitivamente voy a echar un vistazo a eso. – nicholas

Respuesta

4

Aquí hay una solución que podría funcionar.

intente Crear una nueva función de transición que ponga en cola una devolución de llamada adicional. Esta devolución de llamada puede limpiarse una vez que la animación haya sido cancelada por parada. Borrar y Omitir instrucciones Sin embargo, no se reciben de la función de parada anterior. Pero podemos crear una nueva función de parada para eso. Esto se acaba de teclear en el navegador y no está comprobado

(function($){ 
    $.fn.stopableTransition = function (...){ 
     var skip = false 
     var clear = false 
     this.handle("stopTransition", function(doclear, doskip){ 
      skip = doskip; clear = doclear; 
     }) 
     this.transition(...) 
     this.queue(function(){ 
      if(skip){ 
       //todo: ensure animation is removed from css 
       //todo: move object to where the animation would have finished 
      } 
      else 
      { 
       //todo: ensure animation is removed from css 
       //todo: make sure object stays at its current position 
      } 

      if(clear){ 
       skip = false 
       clear = false 
       $(this).clearQueue() 
      } 
      else 
      { 
       skip = false 
       clear = false 
       $(this).dequeue() 
      } 

     }) 
    } 
    $.fn.stopTransition = function (clear, skip){ 
     clear = (typeof(clear) === 'undefined') ? false : clear; 
     skip = (typeof(skip) === 'undefined') ? false : skip; 
     this.triggerHandler("stopTransition", [clear, skip]) 
     this.dequeue(); 
    } 
})(jQuery) 
+0

4 upvotes, ¿alguien lo ha probado? – mu3

0

Como dijo Más @ Jason, busqué en el que el hilo y descubrí que un fork existe y tiene una función llamada transitionStop() (y para la limpieza de toda la restante animaciones también debe llamar al clearQueue()), pero considerando el hecho de que esta horquilla tiene su último compromiso hace aproximadamente un año, y la TransitJS original tiene la última confirmación hace aproximadamente 3 meses, tal vez le faltarán algunas características usando esa horquilla.
Pero para lo que necesito, es la forma más rápida.