анимации Javascript в JQuery с использованием transform.js

Question

я буду выполнять некоторые анимации с эффектами переходов с помощью плагина demo'd здесь http://www.binpress.com/app/demo/app/145

Однако я использую несколько переходов на том же элементе.

В основном у меня есть анимация с 5 кругами, работающими как объекты-спутники вокруг центральной точки. Центральная точка имеет небольшую стрелку, и когда вы наводите курсор на любую из точек со спутника, она трансформируется с помощью этого плагина на спутник.

Вот пример того, что я делаю, упрощенный.

jQuery(".applications").bind('mouseover', function(){ 
    console.log('fired the second animation'); 
    jQuery(".midpointer").animate({ 
     transform: 'rotate(190deg)' 
    }); 
}); 


jQuery(".hosting").bind('mouseover', function(){ 
    console.log('fired the second animation'); 
    jQuery(".midpointer").animate({ 
     transform: 'rotate(190deg)' 
    }); 
}); 

Теперь проблема заключается в том, что после первой анимации любые последующие зависания не вращают элемент. Поэтому я предполагаю, что мне нужно выполнить некоторую форму сброса, я смотрел на .stop() в jQuery, но мало помог.

Кто-нибудь проливает свет на это для меня?

Answer 1

Я считаю, что вы поворачиваете 190deg от начальной позиции каждый раз, когда вы наводите мышь, а не на текущее вращение объекта. Согласно документации, вы можете использовать += добавить к текущему вращения: transform: '+=rotate(190deg)'