WIP animations
This commit is contained in:
31
src/animations.js
Normal file
31
src/animations.js
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
import anime from 'animejs/lib/anime.es.js'
|
||||||
|
|
||||||
|
// Appear/Disappear
|
||||||
|
export const zoomFadeIn = (node, { targets, duration }) => {
|
||||||
|
return {
|
||||||
|
css: t => {
|
||||||
|
anime({
|
||||||
|
targets,
|
||||||
|
duration,
|
||||||
|
easing: 'easeInOutCirc',
|
||||||
|
opacity: [0, 1],
|
||||||
|
scale: [.9, 1],
|
||||||
|
delay: anime.stagger(100)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
export const zoomFadeOut = (node, { targets, duration }) => {
|
||||||
|
return {
|
||||||
|
css: t => {
|
||||||
|
anime({
|
||||||
|
targets,
|
||||||
|
duration,
|
||||||
|
easing: 'easeInOutCirc',
|
||||||
|
opacity: [1, 0],
|
||||||
|
scale: [1, .9],
|
||||||
|
delay: anime.stagger(100)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user