Включить масштабирование PInch только для элементов img

Question

У меня проблема с получением изображений для увеличения на Ipad (особенно в Chrome). Я нашел тонны решений в Интернете, но у меня ничего не работает. Я изменил метатеги для области просмотра, чтобы она была "масштабируемой пользователем", но это не работает для Chrome, только для сафари. Я знаю, что это можно сделать, потому что я видел это на сайте MM Lafleur (ссылка ниже).

Я бы предпочел, чтобы изображения просто увеличивались, а не весь сайт, но сейчас я приму любое решение. Какие-либо предложения??

https://mmlafleur.com/shop/rebecca-black

Answer 1

Добавьте этот CSS и все готово...

.product-detail-main-container:hover {
    background-size: auto 170% !important;
}

.product-detail-main-container {
    transition: 0.2s all;
    background-size: auto 100% !important;
    background-repeat: no-repeat;
    pointer-events: none;
}

.product-detail-main-container .product-detail-zoom-area {
    pointer-events: auto;
}