Mutiple Page Load Interactions not working

Hi there,

I just can’t get a grip to Page Load Interactions. I have multiple elements which I want to animate:

  • header when page is loaded (header animates into view)
  • an element (badge) in header which rotates
  • an element (badge) below on the page which rotates

I have multiple Times Animations set. And it seems when I click to make one Times Animation active, the other ones aren’t working.

Screenshot 2023-01-05 at 09.58.54

Do I need to add all those animations into one Times Animation? That would be very cluttered imo. Isn’t there a way to make multiple Times Animations on Page Load that are working at the same time?

Looking on Google or YouTube I only get examples of one Timed Animation on Page Load. But can’t find a good tutorial or explaination to do multple Times Animations on Page Load which are different animations with are also a different duration.

The rotation element has a 12s duration for example. The header that animates into view has a duration of 2s.

Anybody that can help me out here? I would really appreciate that.

Thanks in advance.

If you want to stay native you have to add everything in the same interaction