How can i create this in webflow


this animation in webflow , how can i achive it or create it

(how to access public share link)

Hi there,

Creating a bouncing ball animation in Webflow is straightforward using the Interactions feature. Here’s how to set it up:

  1. Create a div block with 30x30px dimensions, add a background color, and set the radius to 50% to make it circular
  2. Open the Interactions panel and create a new page load trigger
  3. Add these animation actions for the ball:
    • Initial state: Move up on Y-axis to -100
    • Action 2: Move to Y=0 with 0.5s duration and bounce easing (this creates the landing effect)
    • Action 3: Move back up to Y=-100 with 1s duration and in-out cubic easing (this creates the smooth lift)
  4. In the Interaction Settings, enable the loop option to make the animation continuous

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.