Задать вопрос
butteff
@butteff
Раз в тысячу лет заправляю свитер в носки
javascript

Подгружает ли браузер картинки при css display:none?

Есть задача сделать подгрузку картинок при скролле аяксом. Есть мнение, что
достаточно будет задать картинкам display:none, а потом показывать их, при скролле, мол тогда они и будут подгружены. Так ли это и во всех ли браузерах? Или надо иное решение?
  • Вопрос задан
  • 2786 просмотров
Комментировать
Подписаться 3 Оценить Комментировать
Пригласить эксперта
Ответы на вопрос 2
Suntechnic
@Suntechnic
Подгружает.
Пример - news.kipov.ru
Проматываете вниз и жмете Показать еще. Там как раз эта особенность используется для прекэширования следующей страницы.

Иное решение выгурзить все src в js объект и создавать img из него при необходимости.
Ответ написан
Комментировать
Комментировать
a_sofin
@a_sofin
Frontend-разработчик
Как только браузер видит источник в теге img, то моментально делает запрос.
Можно использовать следующий прием:
<div style="display:none">
    <div style="background: url(img.png)"></div>
</div>

Браузер не будет вычислять стили дочерних элементов для отрисовки страницы, соответственно не будет делать запрос.
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
SummerWeb • Ярославль
от 100 000 до 140 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
JavaScript Fullstack
OnClass
от 200 000 до 600 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Приложение или модуль для Wordpress для учета поездок по QR
25 апр. 2024, в 03:58
10000 руб./за проект
Ошибка в 1с при выгрузке товаров на сайт на Битриксе
25 апр. 2024, в 03:08
3000 руб./за проект
Создание и публикация короткого (reels) UGC-видео на YouTube-канале
25 апр. 2024, в 01:46
500 руб./за проект
Ещё заказы