Использование JQuery .animate () для начала с одного значения и до другого

Question

Можно ли использовать метод jquery .animate () для анимации свойств от (явно установленного) начального значения до конечного значения, или оно всегда должно быть от текущего значения к другому значению?

Answer 1

Насколько я знаю, это должно быть текущее значение до конечного значения.Но допустим, вы хотите анимировать высоту от 20 до 100 пикселей;Просто сделай:

$('#elem').css('height', '20px').animate({ height: 100 }, 1000);

Answer 2

Вы можете просто указать начальное значение, установив его как псевдо-селектор.

Давайте рассмотрим, что вам нужно анимировать некоторое значение, которое не является свойством 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);
}});

Рабочий пример можно посмотреть на JSFiddle здесь .

Answer 3

.animate() всегда будет переходить от текущего установленного значения свойства, которое вы анимируете, к конечному значению, которое вы указываете методом. Если вы хотите перейти от непрозрачности 0,75 до 0,25, а текущее значение равно 0,5, вам нужно будет сделать .css('opacity',0.75).animate({opacity: 0.25})

Answer 4

Просто установите значение свойства перед вызовом animate ().