DariaShvakh
@DariaShvakh
"Она - безнадёжна" (с)

Как отменить загрузку img на мобильных?

Скажите пожалуйста как запретить (именно - запретить) загрузку - img на мобильных ?
Изображения (png) в html - img (паралакс).

Если потом на мобильных через медиа-запрос просто скрывать через display - none, то это отражается на скорости т.е. они всё-равно загружаются, но просто не отображаются.

Если через source то тоже - нет, для мобильных грузится по средствам css bg-img.

Может можно как-нибудь ещё запретить загрузку этих img на мобильных?
  • Вопрос задан
  • 91 просмотр
Решения вопроса 1
ThunderCat
@ThunderCat
{PHP, MySql, HTML, JS, CSS} developer
Скорее всего это должно подойти:
<picture>
   <source 
      media="(min-width: 650px)"
      srcset="images/img1.png">
   <source 
      media="(min-width: 465px)"
      srcset="images/img2.png">
   <img src="images/img-default.png" 
   alt="a cute kitten">
</picture>
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
tomgif
@tomgif
Веб-разработчик
Можете использовать любой lazy-load плагин, которому можно запретить подгрузку изображений при определённой ширине экрана. Также не подгружаются изображения установленные через background у блоков с display: none
Ответ написан
@antonwx
Отдавать разный код в зависимости от юзерагента. Можно и на клиентской стороны с помощью JS - если клиент не мобильный, вставляем картинку, мобильный - не вставляем.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы