top of page

Set the trigger element

  1. Add a button and design it the way you want "#button2"

 

Set the popup element

  1. Add a Container "#box7"

  2. Add elements to the container (Images, Buttons..) and design the popup you want to create

  3. Don't forget to add a 'Close' button or 'X' shape "#vectorImage2"

  4. Turn on Dev Mode Select the Container "#box7" and set the its Default Values to [hidden] (Check the 'Hidden' box)

  5. Copy & Paste the code and replace the ID of the element "#button2", "#box7" ,"#vectorImage2" according to your elements IDs. You can display them in the Layers Panel.

  6. Set the effectOptions values ("duration" and "delay") and effectName("fade", "zoom", "Fly" etc..) to control the different effects

  7. Preview 🙂

Velo Description

​

The show() function shows the element and returns a Promise that is resolved when the effect is complete and the element's [hidden] property has been set to false.

You can optionally apply an effect when showing the element by providing an effectName value. You can also customize the effect by providing the optional effectOptions object.

Velo KB reference: https://www.wix.com/velo/reference/$w/image/show

bottom of page