Image Power Zoomer scrunched up image

[BelgarathTAO]

1) Script Title: Image Power Zoomer v1.1

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

3) Describe problem: This script (and others like it) always compress vertically in the zoom window. So I can see the larger image, but only when all the way to the left side of the image, and it compressed to a very narrow resolution.

I have looked at it using firebug, and it appears to be taking my 3000px image and displaying it 200px wide. Height appears to be working just fine. Any thoughts on why it would do that?

Thanks in advance

Belgarath the Ancient One

[BelgarathTAO]

So after fighting it for a day and finally posting here, of course I fix it 1 minute later. Using the default .css template for a liquid layout, it had the following line, that messed this script up:

img, object, embed, video { max-width: 100%; }

Anyway, I removed img from the line, and working great now. Maybe this will help someone else down the line.

Belgarath the Ancient One

[moderncrowd]

THANK YOU THANK YOU THANK YOU THANK YOU!!!! I registered for a Dynamic Drive account at midnight just to thank you. I have been pulling my hair out for 3 hours with this exact issue, thinking I was doing something wrong or my website had some kind of conflicting code. I was so pissed. Now I am so happy. My line of code wasn't exactly the same, but I searched in my global CSS file for anything relating to "img" and "100%" and I found this:

.thumbnail img, .Slideshow img, #imgMfgLogo, img { max-width: 100%; }

Removed it, problem solved. So relieved... Your good deed was a blessing to me, 3 years after you posted it! =)

[moderncrowd]

Sooo...I just realized that removing that code had some side effects on other images throughout the website. So now I have more troubleshooting to do. I can either have the zoom work and have other images off, or have the zoom broken and have the rest of my images right. Any ideas..?

[Beverleyh]

Put .thumbnail img, .Slideshow img, #imgMfgLogo, img { max-width: 100%; } back as it was because you can reverse the max-width setting back to default values on power zoomer images.

Using the example from the demo page,

<img id="myimage" src="ocean.gif" style="width:200px; height:150px" />

Add this to your stylesheet (underneath the max-width: 100%; line);

#myimage { max-width: none; }

Change #myimage to the id you've used. Untested but it should work.

If you need more help, please post a link to your page.