2013-07-17 2 views
0

Вот что я получил происходитRaphael JS парения замедляет анимацию

http://jsfiddle.net/lono1981/CvMEX/2/

var paper = Raphael("paper"); 

var gear1 = paper.image("https://dl.dropboxusercontent.com/u/55552239/Testing%20Stuff/gear1.png",20,20,171,171,171); 

var gear2 = paper.image("https://dl.dropboxusercontent.com/u/55552239/Testing%20Stuff/gear2.png",175,30,43,43,43); 

var gear3 = paper.image("https://dl.dropboxusercontent.com/u/55552239/Testing%20Stuff/gear3.png",190,70,84,84,84); 

var anim1 = Raphael.animation({transform: "r360"}, 4000).repeat(Infinity); 
gear1.animate(anim1); 

var anim2 = Raphael.animation({transform: "r-360"}, 3500).repeat(Infinity); 
gear2.animate(anim2); 

var anim3 = Raphael.animation({transform: "r-360"}, 3500).repeat(Infinity); 
gear3.animate(anim3); 

var f_in = function() { 
    gear1.stop(); 
}; 

var f_out = function() { 
gear1.animate(anim1); 
}; 

gear1.hover (f_in,f_out); 

В основном, когда останавливается при наведении и перезапускает анимацию, анимация замедляется и не повторяется должным образом.

Что я делаю неправильно?

+1

Я думаю, что помог с вопросом, примите его, чтобы он не показывал без ответа – Brian

ответ

0

Fixed его: DEMO

var anim1 = Raphael.animation({transform: "...r360"}, 4000).repeat(Infinity); 
gear1.animate(anim1); 

Вы должны добавить ... в вашем transform() всякий раз, когда вы хотите добавить к файлу преобразования, которые вы делаете каждый раз, когда вы hover.

Удачи вам!

Смежные вопросы