How to set up a hover interaction

The hover trigger lets you trigger an interaction when someone hovers their cursor over an object—usually a button. Like the click trigger, this is often used to cause another element on the page to animate.

With the hover trigger, you can set different effects for when the mouse pointer hovers over (or enters) the object and when theyleave the object. 

Enter an object

The enter property includes the effect (or effects) that’ll happen when someone hovers their mouse over an object, similar to how a standard CSS hover interacts.

Leave an object

The leave property includes the effect (or effects) that you add to an object when the cursor leaves the hover (enter) state.