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