Button in card should animate a parents sibling, but not all elements

Hello, i have a card. Inside that card i have a button. On button click, i want to slide an overlay from bottom to top over the card.

Problem is that that way the button has to trigger parent’s sibiling. And when i have multiple cards, it runs the animation on all the cards at the same time.

See here: ezgif.com-video-to-gif

What I tried:

  • I do not want to create the animation several times and always use selectedElement as target.
  • Webflow does not allow manually runs of animations with ix2 and i also tried to use “fake elements” that i click by code and that then do the animation.
  • Later i also want to animate the open, close icons with lottie, so only using css classes that i add or remove with js is also not so nice.

Does somebody have an idea how to do this? In the past i had this problem already several times but I worked around it or did a different animation, but this time i want a real solution.


https://preview.webflow.com/preview/stahlharts-sublime-site?utm_medium=preview_link&utm_source=dashboard&utm_content=stahlharts-sublime-site&preview=8d92138ce413840f7b04d414e15e0d9a&workflow=preview