Related Posts
Blur allows you to gradually change elements from light to blurry in correlation with visitor movement. An example is that a background image appears and then dissolves according to the parchment.
Advanced or Style> Background
Motion effects
- Scroll Effects: Slide to ON
- Blur: Click the pencil edit icon
Direction: Choose one of the 4 possible directions of the effect:
Merge - The element starts out blurry and gradually becomes lighter, depending on the level settings and the viewport.
Disappear - The element starts out as light and gradually becomes blurry, depending on the level settings and the viewport.
Cast in - The element starts out as clear, then fades and becomes blurry, then becomes clear again, based on the level and viewport settings.
Fade In Out - Element starts out blurry, then becomes light, and then becomes blurry again, based on level settings and viewport
level: Sets the desired maximum blur level from 0 to 10
Viewport: Determines when to start the effect, based on the height of the viewport (the visible size of the device screen). For example, if the viewport value is set between 50 and 100, the effect starts only after you move half the height of the viewport. - Apply effects on: Select this option to apply motion effects on desktop, tablet and / or mobile devices
- Effects Relating to: Choose from Default, View, or Full Page
Tip: Try the following scenario. Set the direction as Fade In and Out. Set the viewport to 30-60 and watch what happens: the heading starts in focus, reaches the maximum Blur level at 30%, stays the same through 60%, and fades to the bottom of the screen.