Fluidize animate () итерация jquery - PullRequest
0 голосов
/ 14 января 2019

моя цель - сделать последовательных флюидов увеличения ширины элемента и сделать эту итерацию быстрее и быстрее (до ограничения), я хочу сделать анимацию линейной (без обрезки).

Я попробовал это с jquery-animate (), используя функцию обратного вызова (параметр « complete »), когда анимация заканчивается, новая, с начало " продолжительности " уменьшено.

html часть:

<div id="box" style="width: 50px:height:200px;background-color: green"></div>

JQuery часть:

 var upRate = 1;
 fluidAcceleration();

function fluidAcceleration(){
 let newWidth = $('#box').width() + 50;

 $('#box').animate({width: newWidth+"px" },{
                 duration:1000/upRate,
                 complete:function(){
                     if(upRate< 4)upRate++;
                     fluidAcceleration();
                 }
 });

}

Анимация обрезается каждый раз, когда заканчивается и начинается новый, Я хотел бы сохранить плавную анимацию, устанавливая различную скорость для каждого. есть идеи?

PS: Я мог бы использовать чистый Javascript, если кто-то знает способ сделать это только в JS.

...