How can I create a hover image over the Shoppica Banners? For example, say my image is black and white, and then when I hover over it with my mouse, the image is in full color. Is there any way to accomplish this?
|
|
Hi,
There are two ways to do this effect.
1) Upload two images, one color and one grayscale, and change them on hover with css. This method however could not be achieved without modding the core files of Shoppica Banners module.
2) Use some javascript plugin; you will only have to modify the frontend in this case. Here are some solution to do what you want:
http://www.pixastic.com/lib/docs/actions/desaturate/
http://webdesignerwall.com/tutorials/html5-grayscale-image-hover
http://www.permadi.com/tutorial/jsCanvasGrayscale/index.html
http://www.pryde-design.co.uk/2011/08/greyscale-jquery-plugin/
Hope this will help you.
Best,
ThemeBurn team
|
|