Hover works on two (old) Collection List pages, but not the (new) third

Design help General
1

I’ve been trying to create a new Collection List page that is identical to two other previously built Collection List pages. (Someone else did the original building a year ago.) Because I can’t simply copy and paste from the other Collection List pages, I’ve spent all day learning the ins and outs of Webflow and am finally understanding how divs, containers, and style classes work. I’ve since built the new page exactly as the others look. Except…

I can’t figure out why the Hover actions aren’t working on my new page. (I think) I’ve matched every single element and style class on the two earlier identical pages. Their hovers work perfectly. My new hovers don’t. Clearly I’ve missed something, but I can’t figure out what.

If you click on my preview link, the two earlier pages are /Film and /Television, and the new one is /Documentary.

Thanks so much in advance for any insight you might have…

Here is my site Read-Only: https://preview.webflow.com/preview/five-all-in-the-fifth?utm_source=five-all-in-the-fifth&preview=602a69dfb60cf9d6b559a7b89ecce503

2

Hey man,

Is there a particular reason for using the legacy interactions?

I think the issue is just because you haven’t applied the animation to that element like you have on the other pages. See on the other pages, you can see the interaction is applied on these. On the documentary one there isn’t that selected atm:

image
image1866×759 415 KB

3

Thanks so much for the quick response. I don’t know how to apply the animation to the element. [I didn’t do the two older pages.] Also, should I not be using legacy interactions?