Skip to content

Instantly share code, notes, and snippets.

@fraserhart
Created November 3, 2020 12:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save fraserhart/2f680069f93254252e0cd475cd084afb to your computer and use it in GitHub Desktop.
Save fraserhart/2f680069f93254252e0cd475cd084afb to your computer and use it in GitHub Desktop.
JS Animate DOM Node
const moveItem = (el, distance, duration) => {
const invokedTime = new Date().getTime();
let delta = distance/duration;
let animFrame = null;
const doMove = () => {
const elapsedTime = (new Date().getTime()) - invokedTime;
if (elapsedTime > duration) {
cancelAnimationFrame(animFrame);
el.style.left = `${distance}px`
return;
} else {
el.style.left = `${delta * elapsedTime}px`
}
animFrame = requestAnimationFrame(doMove);
}
doMove()
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment