Header lottie logo animation

Design help Animations & Interactions
1

Hi to all!

Hope someone can help with this issue. Currently building a site for a client where I use lottie logo animation on header to animate on scroll. Everything seems to work fine, the only problem is that I don’t manage to make animation work on all the pages of the site.

Header is made is made into component and pasted on all the sub-pages of the site. Animation is created to affect ellements with class. Seems I’ve tried everything out and are on the path to believe this is some kind of bug. Hopefully someone know the way to fix it.

I attach view link of the project: ( animation is currently working on home page but not on the others )

Here is my public share link: Webflow - Thuen&Matre

2

Hi Vivde!

So the problem is that you’ve applied the dimension only on the link block that is the current page it’s linked to, in this case the homepage.

image
image1920×757 73.7 KB

If you’d apply the style on the same element, on another page, it will function correctly.

image
image1920×817 115 KB

Don’t forget to reset the applied style on the homepage afterwards, so that it doesn’t overwrite it (so that you’d only have to apply styling once).

1 Like
3

Hi Rory,

That was definitely something to fix, but it seemed like that even when I changed the style it wasn’t working. But after going a bit back and forth with changes on animation now it finally works on all the pages as it should.

Thanks for help! :slight_smile: :raised_hands:

https://preview.webflow.com/preview/thuenmatre?utm_medium=preview_link&utm_source=designer&utm_content=thuenmatre&preview=5a8a429117c20b3390f2b83a3da9a9e7&locale=en&workflow=preview

1 Like