I'm searching for a JQuery script that can zoom in a whole div. I found the following plugins:

.iviewer/test/# and /?pid=1&subid=13

The plugins have exactly the things I need (just zoom in and out with your scrollwheel). But I have a problem, I need to have a script that zoom in a plete Div. Can someone help me please?

I'm searching for a JQuery script that can zoom in a whole div. I found the following plugins:

http://test.dpetroff.ru/jquery.iviewer/test/# and http://www.albanx./?pid=1&subid=13

The plugins have exactly the things I need (just zoom in and out with your scrollwheel). But I have a problem, I need to have a script that zoom in a plete Div. Can someone help me please?

• javascript
• jquery
• html
• zooming

Share Improve this question Follow edited Aug 15, 2011 at 12:19 Lightness Races in Orbit 386k7777 gold badges666666 silver badges1.1k1.1k bronze badges asked Aug 15, 2011 at 12:00 JordyJordy 4,7951212 gold badges5151 silver badges8282 bronze badges 4

• what do you mean by zooming a plete div? A div is just a container tag – jasalguero Commented Aug 15, 2011 at 12:14
• Yes, I mean all the content in a div. I am going to place a imagemap inside the div, with a landscape with different buildings on it. And sometimes there are animating gifs on the landscape. When an user zoom in, all the images should zoom in (zo the whole div). – Jordy Commented Aug 15, 2011 at 12:20
• 1 I don't think you can zoom on normal (specially dynamic) content I think it only works with images. Only solution it would be to draw everything on a canvas and then you have more freedom, but it would be quite plex. – jasalguero Commented Aug 15, 2011 at 12:39
• Canvas offers a solution, but not the only solution. CSS3's scale transform allows one to zoom irrespective of the content. – Nirvana Tikku Commented Jan 23, 2013 at 22:31

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 2

what about using the CSS3 transform 'scale' operation -- https://developer.mozilla/en-US/docs/CSS/transform? you'll have to write up the javascript for dealing with the mousewheel, but this will work (I've done this before).

Seems like there's decent support, too: http://caniuse./transforms2d (note from caniuse: The scale transform can be emulated in IE < 9 using Microsoft's "zoom" extension, others are (not easily) possible using the MS Matrix filter)

A code example (jsfiddle or something) would probably be pretty helpful to get a better idea of what you want to achieve. Generally I reckon the CSS property "zoom" animated with jQuery might help here (jsfiddle), but this only works in chrome/safari atm.