12 jQuery Image Hover Effects examples and plugins
Sometimes when you visited a website or blog, especially on those Flash based websites, you’ll see a really nifty and beautiful image hover effects when mouseover their galleries. Feel admired? Want something similar to your site? With the power of jQuery, you can achieve the same results as them without using any Flash.
Image Hover effects can make your website looks dynamic and feel more alive. It is not only can styling your images nicely, but also help you allocate your image caption in better away.?In the following post, I would like to show you 13 awesome jQuery image hover effects examples and plugins that can be integrated into your website and blogs. Or perhaps, it could be a reference for your next project. Enjoy!
by Soh Tanaka
A very nice and FANCY zoomed thumbnail hover effect with jQuery and CSS that imitate the effect of Flash galleries. The thumbnail will be zoomed when hover over and back to normal when hover out.
How do you normally handle your image caption? By displaying below your image itself? Perhaps you should try this jQuery hover effect which helps you display your image caption in really creative and UNIQUE ways!
by Matt Bango
As self-explanatory, this jQuery hover effect will reverse zooms the image while fading in a caption on top of it when hover over. It makes for a pretty slick effect which could be used on thumbnail.
by Soh Tanaka
Applying grayscale effect to thumbnails and images when hover over. Unfortunately, to make it work you have to prepare 2 set of images, color and grayscale. But the final results look amazing.
by Daryl Ginn
With this plugin you can add a zoom effect to your images when hover over while add an overlay on top of it. It’s really simple to setup!
This image hover effect is created by using jQuery animate effect and supports 2 kinds of slide effects, which are horizontal sliding and vertical sliding.
by Remy Sharp
Simple but creative way to use jQuery hover fades effect for your images.
by?Timothy van Sas
Hiding your image caption behind your images and reveal it when hover over. This is pretty simple jQuery hover effect but with nice and smooth effect.
by Brian Reavis
Here’s another simple but pretty jQuery hover effect you can use to display image caption on rollover.
by Catch My Fame
Once again jQuery image hover effect with caption. It takes an image’s title and converts it into caption that appears only when hover over the image.
by Emanuel Kluge
Maybe you should try this jQuery image hover effect for your site and blog as well.
Last but not least, another thumbnail hover effect with fading and transparent caption for you!
That’s all. Hope this gives you an idea on how to empower your website with these jQuery image hover effects. If you have difficulty in matching these effects with your website or you want something else different, why not just create your own style? It’s pretty simple with help of jQuery .hover() function. Or you want to have pure CSS3 Fancy Hover Effect in your web page? Anyway, good luck and have fun with this!