Welcome to the Question2Answer Q&A. There's also a demo if you just want to try it out.

Image zoom on Mouse click/Roll Over

+2 votes
139 views
asked Nov 26, 2016 in Plugins by arjunsuresh
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?
Q2A version: 1.8
commented Nov 26, 2016 by Ziad
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 ;)
commented Nov 26, 2016 by arjunsuresh
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.
commented Nov 26, 2016 by arjunsuresh
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);
}
commented Nov 26, 2016 by Ziad
edited Nov 26, 2016 by Ziad
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.

Please log in or register to answer this question.

...