Affect 'Only Children With This Class' Not working

Hi Guys,

So in my design I have a hover effect that brings up a bottom white border when you hover over an art project image. When building the interaction, I want to use classes, but I’m instead having to use ‘selected element’ because when I choose ‘affect class’ and ‘only children with this class’ the interaction doesn’t work at all. My hierarchy could be the problem, but as far as i can tell, the affected class is a child of the trigger so I don’t know what the issue is. I’m having to create multiple of the same ‘Artwork Animation’ interactions because I cant just re use the same one with classes.

Here’s a gif showing what’s happening.


Read Only Link : https://preview.webflow.com/preview/alexanders-sublime-project-8b35bf?utm_medium=preview_link&utm_source=dashboard&utm_content=alexanders-sublime-project-8b35bf&preview=6d3e4edcdad2be691c34e82615992d75&mode=preview

Published Site : https://alexanders-sublime-project-8b35bf.webflow.io/

site tree problem

You use artbottom only one time (So no way to get same effect for other ArtBox)

image

Duplicate animation problem

Next use the same animation (Looks like you create animation1, animation2, 3…4…5… and so on = hard to create uniform animation like this + buggy because you put a lot of animations types on same class).

Empty/Broken animations

Missing on-hover-out

Your animation missing on “hover out”.

Solution:

Start from zero after you follow this tutorial (Try first to follow step-by-step this tutorial - not only watch).

@Siton_Systems first off thank you for taking a look.

I didn’t think I would need multiple ‘artbottom’ for the animation to work properly. My thinking was I would create one instance of it, and if it worked, then I would duplicate it to the rest of my 'ArtBox’s

But I went ahead and created the other artbottom classes and it works fine now. Thank you.

Great :slight_smile: Please mark as solution to close this topic.

1 Like