Carousel: Fix reveal

2020-04-21 18:12:32 +02:00
parent e9ad9deafd
commit a4f4b55705
1 changed files with 24 additions and 22 deletions
--- a/src/animations/Carousel.js
+++ b/src/animations/Carousel.js
@@ -52,27 +52,29 @@ export const animateIn = scope => {

    // Reveal on scroll
    let visible = false
-    const carouselReveal = ScrollOut({
-        once: true,
-        targets: scope,
-        onChange: (el, ctx) => {
-            requestAnimationFrame(() => {
-                if (ctx.visible === 0) {
-                    visible = true
-                }
-            })
-        },
-        onShown: (el, ctx) => {
-            requestAnimationFrame(() => {
-                // If revealed on scroll, no delay
-                if (visible) {
-                    tl.restart()
-                }
-                // If revealed on load, add a delay
-                else {
-                    setTimeout(() => tl.restart(), animDelay * 2)
-                }
-            })
-        }
+    requestAnimationFrame(() => {
+        const carouselReveal = ScrollOut({
+            once: true,
+            targets: scope,
+            onChange: (el, ctx) => {
+                requestAnimationFrame(() => {
+                    if (ctx.visible === 0) {
+                        visible = true
+                    }
+                })
+            },
+            onShown: (el, ctx) => {
+                requestAnimationFrame(() => {
+                    // If revealed on scroll, no delay
+                    if (visible) {
+                        tl.restart()
+                    }
+                    // If revealed on load, add a delay
+                    else {
+                        setTimeout(() => tl.restart(), animDelay * 2)
+                    }
+                })
+            }
+        })
    })
 }