Магазин на вукоммерс. Картинки нужны именно фулл-сайз, а не сингл, чтобы при открытии магнификом они были прям огромные. Верстал не я, это вообще шаблон, я подправлял только кое-что.
Большой картинке задана высота и object-fit: cover
.p-thumb .slick-track, .p-item video, .p-item img {
height: 618px!important;
object-fit: cover;
}
На ширине 992 cover меняется на contain. Высоту маленьких и галереи я не трогал.
В основном все ок, но
вот пример
При уменьшении экрана картинка начинает пикселиться. Раньше никогда не видел такой проблемы. Я и так не обратил внимание, заказчик обратил.
Особенно меньше 1199рх, где сама картинка как раз и начинает применять cover, из-за потери первоначальной ширины. Если отключить cover, то пропадают пиксели, но пропадает и главная роль. Высоту картинки для компьютеров нужно сохранить до перехода на планшеты 992рх.
Я пробовал задавать эту же высоту не картинке, а родителям - от ближайшей ссылки и выше-выше до обертки .single-product-thumbnail.pr.left - не дает эффекта.
Это из-за того, что size-full, или cover и должен делать пиксели? Для меня cover впервые делает такую проблему. раньше он только всегда спасал от ненавистных мне картинок бэкграундами, которыми переполнены старые шаблоны.
На кодпен не буду выкладывать, нет. Прошу глянуть в инспекторе.
Простой
Средний
Простой
