jQuery.Lazy () - ленивая загрузка фонового изображения раздела с идентификатором - PullRequest
0 голосов
/ 10 июня 2018

Я хочу применить ленивую загрузку для одного изображения методом .lazy () для раздела с id.В разделе настроен фон с помощью CSS.Ниже приведен код:

HTML

  <section id="showcase">
  </section>

CSS

/* Showcase*/
#showcase {
  min-height: 400px;
  background: url("../img/example.jpg") no-repeat -300px -500px;
  background-size: cover;
}

JS

<script>
  $(function() {
     $("#showcase").lazy();
  });
 </script>

Как изменить код?Потому что сейчас это не работает.Он работает только тогда, когда у меня есть код и тег <img class="lazy" data-src="../img/example.jpg" />, как вы можете видеть в примере ниже:

http://jquery.eisbehr.de/lazy/example_basic-usage

1 Ответ

0 голосов
/ 10 июня 2018

Согласно документам и демонстрациям JQuery.Lazy на их веб-сайте, вы можете загружать фоновые изображения, устанавливая атрибут data-src для элемента, для которого вы хотите загрузить фоновое изображение.

Так что в вашемЕсли вы могли бы сделать следующее:

<section id="showcase" data-src="../img/example.jpg"></section>

Тогда вам нужно будет удалить определение background-image из стиля css.

Вы можете проверить их рабочий пример на их веб-сайте..

...