Hover Effects – easily create any hover effect

July 12, 2024

Hover Effects – easily create any hover effect Plugin

Hover Effect is easily applied to your own elements, modified or just used for inspiration.

All effects make use of a single element (with the help of some pseudo-elements where necessary), are self contained so you can easily copy and paste them.

Many effects use CSS3 features such as transitions, transforms, and animations. Old browsers that don’t support these features may need some extra attention to be certain a fallback hover effect is still in place.

Main features

39 hover effects
Ease for use
Use in menu
Use for any element

2D Transitions

Grow
Shrink
Pulse
Pulse Grow
Pulse Shrink
Push
Pop
Bounce In
Bounce Out
Rotate
Grow Rotate
Float
Sink
Bob
Hang
Skew
Skew Forward
Skew Backward
Wobble Horizontal
Wobble Vertical
Wobble To Bottom Right
Wobble To Top Right
Wobble Top
Wobble Bottom
Wobble Skew
Buzz
Buzz Out
Forward
Backward

Shadow and Glow Transitions

Shadow
Grow Shadow
Float Shadow
Glow
Shadow Radial
Box Shadow Outset
Box Shadow Inset

Speech Bubbles

Bubble Top
Bubble Right
Bubble Bottom
Bubble Left
Bubble Float Top
Bubble Float Right
Bubble Float Bottom
Bubble Float Left

Use with other plugins to maximize your results

Support

Search for answers and ask your questions at support center

Installation

Installation option 1: Find and install this plugin in the Plugins -> Add new section of your wp-admin
Installation option 2: Download the zip file, then upload the plugin via the wp-admin in the Plugins -> Add new section. Or unzip the archive and upload the folder to the plugins directory /wp-content/plugins/ via ftp
Press Activate when you have installed the plugin via dashboard or press Activate in the in the Plugins list

FAQ

How to use Hover Link Plugin?

Just add the effect class to links, buttons, logos, SVG, featured images and so on. The class is under an effect name

How to add an effects to menu?

Go to page Hover Effects
Select effect and copy class (begin with ‘hvr-‘)
Go to Appearance -> Menus, select which menu item to which you want to add the effect, and add the effect class under ‘CSS Classes (optional)’
Save your menu

Why don’t I see an option to add classes?

Under Appearance -> Menus, click ‘Screen Options’ (top right of screen) and make sure that ‘CSS Classes’ is checked. If not – check it!

Changelog

2.1.2

Fixed: minor bug with PHP 8.2

2.1.1

Fixed: security issues

2.1

Added: Copy class function

2.0

Changed: Admin style
Fixed: minor bugs

1.0

Initial release