Animation to a Container When Showing and Hiding

Hello,

I’m having difficulty adding animations to a container in WeWeb. My goal is to apply a smooth animation when the container appears and disappears on the page.

Details:

  • Desired Animations: Zoom in/Fade in when appearing and Zoom out/Fade out when disappearing.
  • Steps Already Taken:
    • I added custom CSS in the “Custom CSS” field of the container.
    • I used boolean variables to control the visibility of the container, but the transition option doesn’t work properly.
    • I also tried placing the container inside a modal (since the modal has native animation), but the container is too large and doesn’t fit well within the modal, which is designed for smaller content.

I’m attaching a video example of what I want to achieve. (Notice that when you click the “plus” button, a new tracks creation container appears with smooth transition effects).Video

Question:

How can I effectively apply animations to a container in WeWeb when showing and hiding it? Is there a specific method or configuration in WeWeb that I might be missing?

I appreciate any guidance or solution that can help me resolve this issue.