jquery - アニメーションを繰り返すことができません - jQuery Transit

Question

jQuery プラグインTransitを使用して、

アニメーションを 1 回以上繰り返すことができません。

これは私のjQueryです：

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

Answer 1

問題は、カート アイコンを初めて移行するときに、360 度回転することです。2 回目に移行しても、その状態のままです。もう一度トランジションします... 360 度から360 度です。つまり、何も起こりません。毎回アニメーション化するには、トランジションを元に戻す方法を選択する必要があります。

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

これは 1 つの可能性にすぎません。

$('.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);
        });
    }
});