Modal
Last updated
Last updated
A modal is a popup that can be displayed in the center of your page.
Once you’ve added your modal element, click “Edit Modal” to open up the popup area to build the contents.
Usually, you need to add interactions to open and close model, see Displaying a modal
z-index: Set the z-order (stack order) of a positioned element. It is used to make sure the modal is displayed on top.
Show mask: Determines whether you want to darken the page when the modal is open.
Show dismiss button: Display the close button at the top right of the modal.
Close modal after clicking on mask: Enable this option to close the modal when a user clicks outside of it.
See Tooltip for tooltip configurations.
To trigger the modal to open, set up an interaction on another element, such as a button.
Here is an example for a button click to trigger the modal to open.
Open Modal: Triggered when a user opens the modal.
Close Modal: Triggered when a user closes the modal.
Open Modal: Display modal on the screen.
Close Modal: Close modal.
Set Data: Change element data. See Data Store.
Set Loading: Set loading animation. See Set loading animations.
Visit Interactions for more on events and actions.
