AbanteCart Community

AbanteCart Development => Customization help => Topic started by: marino on August 23, 2013, 06:00:44 AM

Title: No image enlarge
Post by: marino on August 23, 2013, 06:00:44 AM
I would like to know how do turn off the enlargement of images when mouse on image.
The problem is when i hover over an image it enlarges and you can see the photoshop work and it is not okey.
So i want to disable this function. So that when i hover over an image the image doesn't enlarge.
Help please.
Title: Re: No image enlarge
Post by: abolabo on August 23, 2013, 09:50:59 AM
you should to find css-propetry transform
Code: [Select]
transform: scale(1.2, 1.2);
-ms-transform: scale(1.2, 1.2); /* IE 9 */
-webkit-transform: scale(1.2, 1.2); /* Safari and Chrome */
-o-transform: scale(1.2, 1.2); /* Opera */
-moz-transform: scale(1.2, 1.2); /* Firefox */
transition: all 0.8s;
-ms-transition: all 0.8s; /* IE 9 */
-moz-transition: all 0.8s; /* Firefox 4 */
-webkit-transition: all 0.8s; /* Safari and Chrome */
-o-transition: all 0.8s; /* Opera */
and remove
Title: Re: No image enlarge
Post by: abolabo on August 26, 2013, 10:07:52 AM
on product page:
open file public_html/storefront/view/default_html5/template/pages/product/product.tpl
and remove class cloud-zoom
Title: Re: No image enlarge
Post by: marino on August 26, 2013, 11:47:42 AM
I have removed the class cloud-zoom.
But this has provoked this.(see picture)
I am not sure but i think that this zoom function could be in cloud-zoom.1.0.2.mini.js.
Title: Re: No image enlarge
Post by: marino on August 26, 2013, 12:00:46 PM
Okey i have found the problem.
I am just gonna post the awnser just in case someone else need's it.
In the document cloud-zoom.1.0.2.min.js you have to find this line "<div id="cloud-zoom-big" class="cloud-zoom-big" style="display:none;position:absolute;left:%0px;top:%1px;width:%2px;height:%3px;background-image:url(\'%4\');z-index:99;"></div>'" and change the red value to "%0" and save it.