Okay
  Public Ticket #1187233
zoom effect on product images
Closed

Comments

  • julius started the conversation

    how can i remove the zoom effect when you hover over a product image? and also disable the ligthbox popup when clicked?

  •  1,560
    Laborator replied

    Hi Julius,

    You can't disable the zoom in but you can disable the lightbox by adding the following CSS in your Custom CSS area:

    .laborator-woocommerce .product-single .product-left-info .product-images .woocommerce-main-image {
        pointer-events: none !important;
    }
    

    Best regards,
    Laborator Team


      Documentation         Join Kalium Users Group

  • julius replied

    are you able to adjust the amount of zoom that it does on mouse over with css?

  • [deleted] replied

    Hi there,

    This is currently not implemented however I have added this feature so you can apply it before we release the new update, here is what you need to do (note that you don't need to worry about future updates, you won't loose anything):

    1. Download this file and replace it in this directory (of the theme): /assets/js

    2. Add the following code in Theme Options > Footer > Tracking Code:

    <script>
    window.productZoomImageOptions = { magnify: 1 };
    </script>

    Adjust the magnify percentage (default is 1 which means 100% of natural width and height of image) and then save Theme options.

    3. If you don't see the change immediately, please hard-refresh your browser (CTRL/CMD+R) because it takes longer to load the changes, as they are saved in browser cache. Another option is to open new private/incognito window and try if it works.

    I hope this will work fine for you.

  • julius replied

    Sweet thank you! When is the update coming out?

  • [deleted] replied

    Hi julius,

    For the moment we don't plan to release a new update so we don't have an ETA for that.

  • julius replied

    Are you sure I copy the code in the footer-tracking code section? I did everything but it still doesn't change the zoom level. I set it to 1 which should zoom in to the actual size correct?

  • [deleted] replied

    Hi Julius,

    The changes have been applied however you have not specified the zoom level which is set to:

    magnify: 1,

    If you want a higher zoom you can set it for example to 120%:

    magnify: 1.2

    And so on.