Locations: Reset delay between locations on complete
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
Would increment and create a super long delay otherwise
This commit is contained in:
@@ -2,21 +2,24 @@ import anime from 'animejs'
|
||||
import ScrollOut from 'scroll-out'
|
||||
import { animDurationLong } from 'utils/store'
|
||||
|
||||
// Variables
|
||||
let delay = 0
|
||||
|
||||
|
||||
/*
|
||||
** Transition In
|
||||
*/
|
||||
export const animateIn = scope => {
|
||||
let delay = 0
|
||||
|
||||
// Each location (reveal on scroll)
|
||||
scope.querySelectorAll('.location').forEach(location => {
|
||||
const tl = anime.timeline({
|
||||
easing: 'easeOutQuart',
|
||||
duration: 600,
|
||||
autoplay: false,
|
||||
delay
|
||||
delay,
|
||||
complete: () => {
|
||||
// Reset delay
|
||||
delay = 0
|
||||
}
|
||||
})
|
||||
|
||||
// Image
|
||||
@@ -42,14 +45,14 @@ export const animateIn = scope => {
|
||||
translateZ: [0, 0]
|
||||
}, 200)
|
||||
|
||||
// Increase delay between locations
|
||||
delay += 65
|
||||
|
||||
// Scroll reveal
|
||||
ScrollOut({
|
||||
once: true,
|
||||
targets: location,
|
||||
onShown: () => tl.restart()
|
||||
})
|
||||
|
||||
// Increase delay between locations
|
||||
delay += 65
|
||||
})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user