This page is filled with demos showing off many of the available options and possibilities for the jQuery HoverUp plugin. Just hover over the boxes to get a feel of what HoverUp is capable of.
Ready to start playing yourself? Have a look at the source code of this page.
The caption styles are set via different CSS classes.
The options for HoverUp are passed along via the class
attribute of the box, via the jQuery Metadata plugin.
Default caption
Basic caption using the default options
Using shiftContent:20
The content shifts too, creating a subtle effect
Using shiftContent:'push'
Creating a sliding effect
Using position:'top'
Look at me! I'm up here! Coming in with a bouncy effect.
Using shiftContent:-40
and slower speedIn
Reversed effect
This caption will hide on hover.
Simply set reverse
to true
.
Using shiftContent:-40
and reverse