...
Determines the effect that is applied when the mouse hovers over the element. You can choose between rise and scale. With the Rise effect, the element is moved slightly upwards. The Zoom in slightly effect makes the image larger. Effects that are geared towards mouse interaction are ideal for clearly highlighting links to images or similar for the customer.
...
Parallax
...
This effect allows you to move a block along with the scrolling of the page. With the Parallax effect it is possible to simulate spatiality. To do this, you need blocks that move independently of each other and of the page as you scroll. Elements that should be in the background must move slower in relation to elements in the foreground. This allows you to create spatial depth effects. Unlike background parallax, you can specify in which direction the image should scroll and whether only content or the entire block is affected. Often the parallax effect makes little sense on small resolutions, so you can define a filter that suppresses the effect depending on the resolution. For the filter, specify the resolution level and an operator that determines when the effect is applied.
...
A definition of ">=md" would mean that the resolution must be at least tablet dimensions (medium) for the effect to be applied.
...
Reveal
You can use the Reveal effect to fade in blocks with an effect. This can be used, for example, to draw the visitor's attention to a specific block content. Reveal effects are started as soon as the story or the block is visible in the image section. There are several settings available to adjust the effect as desired. In addition to the type of fade-in effect, you can specify the animation curve, duration and delay, as well as the initial offset of the block.
...
Enable Reveal: Determines whether the effect is enabled. Further options appear only when activated.
Reveal Effect: Determines the effect used to fade in the block. Various effect types such as Fade (fade in), Flip (rotate), Slide (slide) or Zoom (zoom in/out) are available.
Easing: Determines the speed curve of the fade-in . In addition to a linear curve, a selection of elastic curves is also available.
Duration: The duration of the animation in milliseconds.
Delay: The delay until the animation starts in milliseconds.
Distance: Distance between start and end position while animating the block (CSS size unit, default 100px).
Trigger Offset: The effect ist triggered when the upper edge of the block hits the lower edge of the screen. This trigger point can be adjusted using a pixel offset. A negative offset ist also valid. Default value is 120.
Fade In Only once: Determines whether the effect is applied to the block each time it appears.
Apply effect to: Defines the elements that are affected by the animation. You can apply the effect either to the complete block or only to the block content
Tint
The Tint effect changes the transparency of the background on mouse hover. Note that the block background must have transparency for the effect to be applied.
...
| Info |
|---|
Note: Some effects are not applied in the Edit view. Switch to Preview mode to test them. |
Advanced
In this tab, the layout configuration is specified as a JSON object. Here you can specify spacing, rows and columns, and alignments for each resolution level. Direct modification of these values is intended for experienced users only.