Mouse Hovers for Layer Content

Use the built-in hover settings to apply mouse hover styles for your slider's Layer content.

  • Article Note
    The following covers text and images, but hover options are also available for additional content types such as Buttons, Shapes and Objects using the same setup.

1. Hovers for Text Layers

back to top
1.1 Add a Text Layer to the editing stage, and style its default view.
1.2 Select the Advanced Styling tab, along with the Hover option.
1.3 Enable the "Layer Hover" option, and then adjust the hover animation settings.

1. Animation Speed

2. Animation Easing

3. Mouse Cursor

4. Hover z-index

1.4 Toggle the styling options to the "Hover" state.
1.5 Apply your special hover styles.

2. Hovers for Image Layers

back to top
2.1 Add an Image Layer to the editing stage.
2.2 Select the Advanced Styling tab, along with the Hover option.
2.3 Enable the "Layer Hover" option, and then adjust the hover animation settings.

1. Animation Speed

2. Animation Easing

3. Mouse Cursor

4. Hover z-index

2.4 Toggle the styling options to the "Hover" state.
2.5 Apply your special hover styles.
50% Transparency/Opacity on Mouse Hover:
With a slight rotation: