I am having issues with the zoom option on my product pages.
Some of the products have the ability to zoom and some products it doesn't even give you the option.
We are looking to go live with the site in the next couple of weeks.
Add a comment
|
2 Answers
I assume you are talking about the default product image zoomer. The one that comes with the default theme.
If have a different zoomer then you should contact the extension developer and ignore my answer.
The default zoomer only appears for images that are smaller than the display size.
Let's say your container for the product image is 265x265 (this is the size in the default theme). If your image is bigger than that then the zoom bar should appear. If it's smaller then there is nothing to zoom.
In js/varien/product.js there is this piece of code that checks the image size and hides the zoom bar if needed:
if (this.imageDim.width <= this.containerDim.width
&& this.imageDim.height <= this.containerDim.height) {
this.trackEl.up().hide();
this.hintEl.hide();
this.containerEl.removeClassName('product-image-zoom');
return;
}
-
Hi Marius that's great, just the information i needed i am using the default zoom but most of my images are 300 x 300. Thank you for your help on this, much appreciated.– GavinJan 9, 2014 at 15:17
-
Maybe you changed the css of your theme and the size of the container is 300x300. Try to add some
console.log()(or uglyalert) in the js code I mentioned and see what are the values forthis.containerDim. That should tell you what are the minimum dimensions that can use the zoom.– Marius ♦Jan 9, 2014 at 15:20
Hmm, in my case the problem was my css:
img { max-width: 100%; }
Afer removing max-width everything was fine again.
