The Worlds Most Powerful
WordPress Builder

If you Purchased & Registered a Slider Revolution License you can comfortably upgrade version 5.x to 6.0 from your WordPress Dashboard.

Why Activate Slider Revolution?

Activating Slider Revolution with your Personal Purchase Code will unlock all available Features.

Easy Live Updates
Personal License Key
200+ Template Library
1000+ Object Library
25+ Amazing Add-Ons
1on1 Ticket Support

*Regular License from $29. One License Key required per Domain.

Slider Revolution 6.0 NOW available!

Add Mouse-Over Styles/Animations to your Layers and set the Cursor Type for the Layer.


1. General Settings

1. Cursor
The default CSS cursor for the Layer.  Set this to "pointer" to give the Layer a "button/link" behavior on mouse-over.

3. Pointer Event
The CSS pointer-events property for the Layer.  Settings this option to "None" is useful when the Layer has other content behind it that are linked.

3. Animation
Enable this option if you would like your Layer to have hover styles/animations.
Only on Desktop - Enable hover styles/animations only on Desktop.

2. Hover Animation

Adds a CSS Transform to the Layer when the user hovers their mouse over the Layer.

1. Transition Time
The total time the transition will take place.  Set this to "0" if you don't want the hover to be animated. 

2. Transition Easing
The easing equation used for the transition.

3. Hover zIndex
Dynamically change the Layer's CSS z-index property.

4. Opacity
Adjust the transparency level for the Layer.

5/6. ScaleX/Y
Scale the Layer's width and height.  Enter a number 0-1 where "1" is equal to equal 100%.

7/8. SkewX/Y
Apply a skew distortion to the Layer.

9/10. RotateX/Y
Apply 3D rotations to the Layer. 

11. 2D Rotation
Apply a 2D rotation to the Layer. 

12/13/14. OriginX/Y/Z
Optional CSS transform-origin points. 

16. Mask
Apply Masking to the Layer

3. Font & Background & Border Styles

1. Text Color
Change the Layer's text color on mouse hover.

2. Text Decoration
Apply a CSS text-decoration such as "underline" to the Layer.

3. Background Color
Change the Layer's background color on mouse hover.

4. Border Color
Set a color for the optional hover border.

5. Border Style
Set this to "solid" if you'd like to display a border for the Layer on mouse hover.

6. Border Size
The top/right/bottom/left sizes of the border.

7. Border Radius
Add an optional CSS border-radius to the Layer.

4. Filter Styles

1. Blur Filter
Apply a CSS blur-filter to the Layer on mouse hover.

2. Brightness Filter
Apply a CSS brightness-filter to the Layer on mouse hover.

3. Grayscale Filter
Apply a CSS grayscale-filter to the Layer on mouse hover, changing the Layer's color to black & white.

Popular Solutions