vanilla-spring
Use keyframes run spring animation.
Tiny, gzip: 0.4kb, run every(Vanilla, React, Vue...) project.
Thank Project: Springer
Install
$ npm install --save vanilla-spring
or
<script src="https://unpkg.com/vanilla-spring@1.0.0/umd/index.js"></script>
Only a function
import vanillaSpring from 'vanilla-spring';
vanillaSpring({
name:'move',
makeReverse: true,
keyframe: v=> `
transform: translateX(${100 * v}px);
opacity: ${v};
`,
})
const view = document.getElementById('view');
view.style.animation = 'move 1s';
// move back and keep end
setTimeout(funciont(){
view.style.animation = 'move-reverse 1s';
view.style.animationFillMode ='forwards';
}, 2000);