generated from Cerchie/bare-bones-vanilla
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
35 lines (23 loc) · 1008 Bytes
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
function startMotion() {
let motionInstance = null;
// Get form values
const mass = parseInt(document.getElementById("mass").value);
const stiffness = parseInt(document.getElementById("stiffness").value);
const damping = parseInt(document.getElementById("damping").value);
const velocity = parseInt(document.getElementById("velocity").value);
// Validate input values
if (isNaN(mass) || isNaN(stiffness) || isNaN(damping) || isNaN(velocity)) {
alert('Please enter valid numeric values for all fields.');
}
// Create motion using Anime.js
motionInstance = anime({
targets: '.thingy',
translateX: [0, 200], // from 0 to 200
direction: 'alternate',
autoplay: true,
loop: 2,
easing: `spring(${mass}, ${stiffness}, ${damping}, ${velocity})`
})
motionInstance.play();
console.log(motionInstance)
}