Как решить проблему с масштабированием на телефоне?

Question

[Сергей]

Есть модалка, которая вызывается по клику на картинку и показывает слайдер из картинок. На телефоне.

Даже не знаю как и где искать решение таких багов. Может хоть кто направит)
На всякий случай - проект на React, в head стоит content="initial-scale=1.0, width=device-width, user-scalable=no",

Проблема 1)
В том, что когда двумя пальцами увеличиваешь на телефоне картинку в модалке, то словно все перестраивается
Например, хочу увеличить диван слева:
до увеличения -

после увеличения -


Проблема 2)
Когда уменьшаешь назад, то появляется на мгновения белые пятна/квадраты, как будто картинка заново подгружается (картинка показан другая). Сами картинки +/- 100 кб
.

Comments

[volucris1]

Похоже, что увеличивается не картинка, а весь сайт

[Сергей]

volucris1, Ну получается так. Хотя стоит user-scalable=no, но видимо не для этих случае он. Есть идеи как сделать ок?

[volucris1]

Сергей, https://webref.ru/layout/html5-css3/img/scale

Масштабирование картинок
Если для элемента не задать атрибуты width и height, то браузер самостоятельно определит ширину и высоту изображения после загрузки файла и покажет его в исходном размере. Рисунок в формате SVG браузеры, за исключением IE, выводят на всю доступную ширину.

Изменение масштаба и пропорций изображения делается как через атрибуты , так и через стили.

Попробуй, может поможет

[Даниил Чистяков]

Попробуйте так?

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />