Basic Usage
1. Include the stylesheet on your document's `<head>`
2. Place the following markup in to your HTML document
3. Edit the URL to your image and add your hover content. Then simply set the imagehover.css class of your choice to the containing figure element. In the example above this has been set to 'imghvr-fade'. A full list of hover effects and their classes can be found [here!](http://www.imagehover.io/).
Adding a Link
To link your image, add an empty <a> tag just after the figcaption element of your markup. Set the href attribute to the URL you wish to link your image to.
Background Color
All background colors are inherited from the containing <figure> element. You can change the background color via some inline CSS added to the figure element like so...
Alternatively this can be applied via your CSS files. The following example will effect all elements with a imagehover.css class applied.
Browser Support
Imagehover.css relies heavily on some CSS3 features including pseudo-elements, animations, transitions and transforms. Some older browsers will have limited support of these features.
Utility Classes (Extended Only)
Utility classes allow you to add unique animations to each element of your caption upon hover of the image. There are 2 types of utility classes, an effect class and a delay class. One of each class can be added to each element where the effect class sets the animation type and the delay class set the delay before the animation is triggered relative to the image been hovered.
Oscar Wilde
"I have the simplest tastes, I am always satisfied with the best."
Read More