не может повторить анимации - JQuery Transit

Question

Используя плагин JQuery Transit,

я не могу получить мою анимацию повторилась больше, чем просто один раз.

Это мой JQuery:

$('.cart').mouseenter(function(){ 
    $('.cartIcon').transition({ 
     perspective: '500px', 
     rotateY: 360 , 
     duration: 400, 
     easing: 'in' 
    }); 
}); 

Answer 1

Ваша проблема в том, что в первый раз переход вашей корзины значок, вы вращать его на 360 градусов. Во второй раз, когда вы его переходите, он все еще имеет это состояние. Таким образом, вы снова переходите ... от 360 градусов до 360 градусов, что означает, что ничего не происходит вообще. Чтобы каждый раз его оживлять, вам нужно выбрать какой-то способ его возврата.

http://jsfiddle.net/rFKw8/2/

Это только одна возможность:

$('.cart').mouseenter(function(){ 
    var $cart = $(this), 
     $cartIcon = $cart.find('.cartIcon'), 
     transitionOptions = { 
      perspective: '500px', 
      duration: 500, 
      easing: 'in' 
     }; 

    if (!$cart.data('transitioned')) { 
     transitionOptions.rotateY = 360; 
     $cartIcon.transition(transitionOptions, function() { 
      $cart.data('transitioned', true); 
     }); 
    } else { 
     transitionOptions.rotateY = 0; 
     $cartIcon.transition(transitionOptions, function() { 
      $cart.data('transitioned', false); 
     }); 
    } 
});