Multizoom - Image sizing in responsive design

[ozinder]

1) Script Title: Multizoom v2.1

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...uredzoomer.htm

3) Describe problem:
For responsive design reasons I have the div and image sizes as percentage values in css. I tried to set up multizoom according to Demo 3, but the script resizes the large image to the height in the image file.

e.g.:

• The <div id="targetarea"> inherits the dynamic css size from its parent, lets say 700px.
• The zoomable <img> has 900x600px.
• In css, the <img> is set to not exceed its parent with {width: auto !important; max-width: 100%;width:100%}, so the image normally resizes well to 700x466

Multizoom styles the <img style="width: 900px; height: 600px"> and the <div class="zoomtracker" style="height: 600px; width: 700px"> , so the image looses its aspect ratio and displays in 700x600.

How do I prevent the script from overwriting the CSS?

Thanks for any help you can give!

[ozinder]

So, no response until now.
I found kthornbloom.com/smoothproducts/ doing it well enough for my purpose.