Как вращать объект с линейным (нормальным) ослаблением?

Question

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

Пример:

Вот код:

HTML:

<div id="rotate_me" style="border: 1px solid red; width: 100px; height: 100px"></div> 

JS:

var rotation = function(){ 
    jQuery("#rotate_me").rotate({ 
     angle: 0, 
     animateTo:360, 
     duration: 1600, 
     callback: rotation 
    }); 
} 
rotation(); 

Answer 1

Использование только CSS3 довольно просто: LIVE DEMO
может быть, вы можете найти свой ответ в этих строках?
(это один для FF, для других бр добавить -browser-specific свойства.)

img { 
    animation-duration: 3s; 
    animation-name: wowrotate; 
    animation-iteration-count: infinite; 
    animation-timing-function: linear; 
} 

@keyframes wowrotate{ 
    from { 
    transform: rotate(0deg); 
    } 
    to { 
    transform: rotate(360deg); 
    } 
} 

Answer 2

Я нашел решение - это добавление параметра:

easing: function (x,t,b,c,d){ 
      return c*(t/d)+b; 
     } 

в функцию циклического сдвига.

Описание об ослаблении функции вы можете увидеть здесь:

What is an easing function?