Эквивалент анимированной функции jQuery в чистом JavaScript

Что эквивалентно следующей анимации jQuery в чистом JavaScript?

function animate(element, position, speed) {
  $(element).animate({
    "top": position
  }, speed);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Ответы

Ответ 1

Вы можете получать сложные анимации с помощью чистого JavaScript.

Используя методы setTimeout и setInterval

Пожалуйста, проверьте здесь.

Вот ключевая часть перемещения элемента

function move(elem) {
    var left = 0
    function frame() {
        left++  // update parameters
        elem.style.left = left + 'px' // show frame
        if (left == 100)  // check finish condition
            clearInterval(id)
    }
    var id = setInterval(frame, 10) // draw every 10ms
}