Image zoom on Mouse click/Roll Over

Question

Many users of my site have been demanding for a zoom feature for images on mouse click. But I suppose this is not really easy to do even with jquery plugin. Any suggestions?

Comments

Can you provide a sample link to better frame it? I might implement if for you for free since you've been contributing quite a bit to the community already ;)

---

Thank you. That would be really nice. I'm looking for something like this but not used to JS.
http://www.elevateweb.co.uk/image-zoom/examples

The issue is some images are small and users would like to click and scale them. But may be this needs to be managed during image upload itself - to properly scale and manage different versions.

---

Got a small way for scaling with just the below CSS. Let me see how it goes.

img {
    transition: -webkit-transform 0.25s ease;
}

img:active {
    -webkit-transform: scale(2);
}

---

I meant a sample link for a page with a few images just so I can test it and figure out the best approach. You can use a lightbox plugin, for instance, but I guess this simple CSS trick should be quite enough even if it might not play well with small images. In those cases you might obtain their size in JS then resize them to their original size when they're clicked.