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
)
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 Please mark as solution
to close this topic.
1 Like