Javascript-анимация в jQuery с использованием transform.js - PullRequest
Новая
       12

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

0 голосов
/ 15 декабря 2011

Я выполняю некоторые анимации с переходами, используя демонстрационный плагин здесь 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, но без особой пользы.

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

1 Ответ

0 голосов
/ 15 декабря 2011

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

...