Hey, I looked through the code and saw a potential issue.
I see you're using threshold in the Intersection observer options to trigger the animation.
This could become problematic if your element is too large. For example if your element is 10 times the height of your viewport then 10% of it could ever fit in the viewport at the same time and the Intersection Observer would never trigger if threshold is set to 0.2. When setting threshold to 0.5 this problem gets a lot more common, especially on mobile devices.
A better strategy would be to use a negative rootMargin instead. You could set rootMargin: '-20% 0 -20% 0' which would trigger the observer callback if the elements scroll 20% above the bottom of the viewport.
Hey, I looked through the code and saw a potential issue.
I see you're using threshold in the Intersection observer options to trigger the animation.
This could become problematic if your element is too large. For example if your element is 10 times the height of your viewport then 10% of it could ever fit in the viewport at the same time and the Intersection Observer would never trigger if threshold is set to
0.2. When setting threshold to0.5this problem gets a lot more common, especially on mobile devices.A better strategy would be to use a negative rootMargin instead. You could set
rootMargin: '-20% 0 -20% 0'which would trigger the observer callback if the elements scroll 20% above the bottom of the viewport.