Wiggle, wiggle, wiggle...
And in essence, both the "wiggle, wiggle, wiggle" Jason sings about and the hover animations do the same thing:
Attract the audience's attention
How to Use Animations the Smart Way
At Thrive Themes, we try to protect you from gimmicky design trends that bloat your website and decrease loading speed so these hover animations are not one of those!
A well placed (hover) animation allows to attract the visitor's attention to the most important element on the page.
It makes a page more dynamic and especially when you use them on buttons, they can boost your conversion rates (but of course, you should split test that!)
Hover animations have the big advantage that they only occur when the visitor actually engages with the element. This will automatically avoid the "flying objects" syndrome you might have encountered on certain websites who went crazy with in view port animations.
Where and How to Add Hover Animations
Thrive Architect allows you to add hover animations to:
- Content Boxes
- Call to Action Boxes
- Guarantee Boxes
- Styled Boxes
Because you can use Thrive Architect on pages as well as blog posts, these animations can be used just as easily to spice up a sales page "Buy now" button as a quote box in a blog post.
In order to add a hover animation, select the element and go to the hover state of that element.
There you'll find a whole bunch of options to apply on hover and in the animations and actions panel, you'll now find the new hover animations.
In the same panel, you'll also find the tooltip option which allows you to add a tooltip on hover.
Ready to Use These Hover Animations?
Let me know what you think in the comments below!