I am practicing some animation here.
Inspiration: http://app-sympla-comprador.webflow.io/
When the section is scrolled into view, the clay phone mockup has the intro-animation of scale + opacity + move. After that, it still has a hover state for a different perspective.
I am trying to do the same for one particular section on my page. The yellow section called Lookbooker.
However, when the page first loads, the scroll-into-view animation doesn’t work. I have to scroll past this section and scroll up/back, the scroll-into-view animation starts working. The hover state of the yellow phone is working regardless.
https://preview.webflow.com/preview/myronluo?utm_medium=preview_link&utm_source=designer&utm_content=myronluo&preview=6a09dec781bc516c996264d93f0681e1&mode=preview
if the animation doesn’t work in the read-only mode, please switch the preview toggle.
Is there a conflict between them? Somebody would help?
Kind regards,
Here is my public share link: LINK
(how to access public share link)