Timing and Transition

The Timing & Transitions section allows you to control how long each page is displayed and how the module animates the movement from one page to the next. These settings are essential for creating dynamic, multi-step popup experiences.

The Timing and Transition interface in the Page Options

Page Timing

Define the display duration and the synchronization of layer animations for the current page.

Duration (Display Time)

Set the amount of time this page remains visible before automatically transitioning to the next one. This value is measured in milliseconds (e.g., 1000 equals 1 second).
Note: To ensure a smooth user experience, avoid using 0 or extremely low values.

Time Shift

This advanced setting controls when the page's layers begin their entrance animations relative to the page transition.

• 0 (Default): Layers begin animating in exactly when the page transition finishes.
• Negative Values: Layers start their animations before the page transition ends, creating a more overlapping, fluid effect.
• Positive Values: Delays the layer animations until after the page transition has been completed for a specified amount of time.

Page Transitions

Creative Popup offers a library of over 200+ predefined transitions to move between pages with professional flair.

Select Transition

Click this button to open the transition gallery. Transitions are categorized into 2D and 3D effects.

• Live Preview: Hover your mouse over any transition name in the gallery to see a live demonstration of the effect in a popup window.
• Randomized Transitions: You can select multiple transitions for a single page. If more than one is chosen, the module will randomly select one of your picks each time the page changes.

Custom Transition Duration

While the default transition speed is 1000ms, you can override this here. This value determines how fast the actual animation effect (the slide, flip, or fade) occurs, independent of how long the page stays on the screen.