Animation

Using

You can animate almost any element on the site from the button to the modal window.

The following animation settings are available for most components:

  • Animation effect
  • Moving length
  • Animation duration
  • Launch delay
  • Launch condition

For pop-up and off-anvas you can individually adjust the fading animation effect.

Animation effects

11 animation effects are available.

Move your mouse to see the animation.
Fade
Scale up
Scale down
Fade up
Fade right
Fade down
Fade left
Slide up
Slide right
Slide down
Slide left

Moving length

For motion animation 2 additional lengths are available: short and long.

Long slide up
Long slide right
Long slide down
Long slide left
Short slide up
Short slide right
Short slide down
Short slide left

Animation duration

The following duration settings are available: default, fast, slow, and custom value.

Fast fade
Fade
Slow fade
Fast slide left
Slide left
Slow slide left

Launch delay

You can select a delay value from 0 to 1 second. If necessary, you can set a custom value.

No delay
Delay 0.2 sec
Delay 0.4 sec
Delay 0.6 sec
Delay 0.8 sec
Delay 1.0 sec

Launch condition

You can select the condition for starting the animation on show, on hover or on click.

On show
On hover
On click