使用JQuery .animate()从一个值开始,到另一个值结束

Yar*_*rin 9 jquery jquery-animate

是否可以使用jquery的.animate()方法将属性从(显式设置)初始值设置为最终值,或者必须始终从当前值到另一个值?

Joh*_*ler 11

据我所知,它必须是最终价值的当前价值.但是让我们假设你要设置从20到100px的高度; 做就是了:

$('#elem').css('height', '20px').animate({ height: 100 }, 1000);
Run Code Online (Sandbox Code Playgroud)


Ale*_*der 7

您可以通过将其设置为伪选择器来简单地指定起始值.

让我们考虑你需要设置一些不是CSS属性的值,从-100到100.在这种情况下你的代码将是:

$({xyz: -100}).animate({xyz:100}, {duration:5000, complete:function(){
    console.log("done");
}, step: function(now) {
    //here you want to place your processing code for every frame of animation.
    console.log("Anim now: "+now);
}});
Run Code Online (Sandbox Code Playgroud)

你可以在这里看到JSFiddle的工作示例.