Question

我做时钟动画它运作良好但我使用setinterval来调用该函数。动画开始时有一点延迟[它在12点停止一段时间]

var timemin=0;
var timehr=0;
var timesec=0;
var a=0;
function clockRotate(){
timemin=timemin+6;
timehr=timehr+0.5;
timesec=timesec+360;
$("#cimg3").animate({rotate:timemin},2500);
$("#cimg4").animate({rotate:timesec},2500);
$("#cimg2").animate({rotate:timehr},2500);
}

setInterval(function(){
clockRotate();
a=1;
},0*2500);

See The Action Here

如何删除此延迟。感谢

Answer 1

您应该使用"linear"。默认情况下，它是＆＃34; swing＆＃34;这使动画在开始和结束时变慢。 Animate Documentation

var timemin=0;
var timehr=0;
var timesec=0;
var a=0;
function clockRotate(){
    timemin=timemin+6;
    timehr=timehr+0.5;
    timesec=timesec+360;
    $("#cimg3").animate({rotate:timemin},2500,"linear");
    $("#cimg4").animate({rotate:timesec},2500,"linear");
    $("#cimg2").animate({rotate:timehr},2500,"linear");
}

setInterval(function(){
    clockRotate();
    a=1;
}, 0*2500);

Fiddle

Answer 2

你缺乏缓和属性：

采取此fiddle

$("#cimg3").animate({
  rotate: timemin
}, {
  easing: "linear"
}, 2500);

动画不正确启动

2 个答案: