O conceito que se está a tentar atingir é o movimento continuo sobre o eixo do X entre um valor e a sua representação em negativo:
Até ao momento, esse conceito tem uma falha, a animação é realizada de 0 graus até ao valor facultado, mas depois ao recuar para o mesmo valor em negativo, existe um pulo para os 0 graus e só depois é que anima para o valor facultado. O mesmo acontece ao voltar ao valor positivo:
Ver exemplo no JSFiddle
$.fn.animateRotate = function(angle, duration, easing, complete) {
var args = $.speed(duration, easing, complete);
var step = args.step;
return this.each(function(i, e) {
args.complete = $.proxy(args.complete, e);
args.step = function(now) {
$.style(e, 'transform', 'rotate(' + now + 'deg)');
if (step) return step.apply(e, arguments);
};
$({deg: 0}).animate({deg: angle}, args);
});
};
// animate snowman
var d = 5;
function jingle() {
$("#snowman").animateRotate(d, {
duration: 1337,
easing: 'linear',
complete: function () {
jingle(d = -d);
}
});
}
jingle();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<img id="snowman" alt="snowman" src="https://i.sstatic.net/AmNNj.png">
O objeto a animar
A imagem em baixo é o objeto que se pretende animar conforme podem analisar nas demonstrações.
Pergunta
Como posso suavizar o efeito de forma a chegar à curva de animação pretendida?