Hover animation doesn't work in tabs?

Hi Webflow designers,

I was building a project page with filtering functions. I have put 5 collection lists with different filtering into tabs, it works well except for the hover animation.

To see the bug please open this page:
https://bcs-dlx.webflow.io/projects
The project page will show the ‘all’ projects firstly. Move your mouse and you can see the normal hover effect: project images changes from grayscale to full colour, title block changes into full width. Then, please click into the ‘completed’ or ‘collaboration’ projects to see the buggy projects. Hover effect doesn’t work in here.

I have applied the same hover animation on all collection items. What am I missing?

Here is my shared link:
https://preview.webflow.com/preview/bcs-dlx?utm_source=bcs-dlx&preview=38de32bca5da0b47f5ed4dd428b340d4
Please go to the ‘projects’ page

Thanks for the help.

It’s solved!
Need to change the animation objects into ‘apply to style’ and ‘affects child only’

1 Like