Solved

PRODUCT ZOOM PROBLEM

IamLLIIME
Trailblazer
268 2 50

Good day! Can someone help me on how can I reduce the zooming effect on my product when the mouse cursor points?

 

https://faxcable.com.ph/collections/ict/products/apple-macbook-pro-16-inch-pre-order-only

Accepted Solution (1)

diego_ezfy
Shopify Partner
2907 557 872

This is an accepted solution.

@IamLLIIME, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

[id] .zoomImg{
    width: 500px !important;
    height: auto !important;
}



You can modify the 500px value to anything you wish. This means basically how large the hovered image's width will be. Height is automatically calculated by the browser depending on the aspect's ratio.

Kind regards,
Diego

View solution in original post

Replies 3 (3)

Anthony_David_
Shopify Partner
417 46 105

It has to be checked in JS @IamLLIIME 

Theme customization | Design | Shopify App Consultant
Have Any Questions? Whatsapp +1 (341) 241-4263
Based in United States

diego_ezfy
Shopify Partner
2907 557 872

This is an accepted solution.

@IamLLIIME, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

[id] .zoomImg{
    width: 500px !important;
    height: auto !important;
}



You can modify the 500px value to anything you wish. This means basically how large the hovered image's width will be. Height is automatically calculated by the browser depending on the aspect's ratio.

Kind regards,
Diego

IamLLIIME
Trailblazer
268 2 50

Wow it works perfectly! Thank you so much! @diego_ezfy