Descripción
La carga diferida se puede aplicar a imágenes, imágenes de fondo y con efecto de aparición gradual como se describe a continuación:
Para imágenes <img>
Para hacer uso de la carga diferida en las imágenes, siga los pasos dados:
<div class = "page-content">
...
<img data-src = "image_path.jpg" class = "lazy">
...
</div>
Para imágenes de fondo
La carga diferida también se puede utilizar para imágenes de fondo, para este caso siga los pasos dados:
<div class = "page-content">
...
<div data-background = "image_path.jpg" class = "lazy">
...
</div>
...
</div>
Con efecto de fundido
Puede agregar un efecto de aparición gradual a sus imágenes utilizando la clase lazy-fadein a image / element.
<div class = "page-content">
...
<img data-src = "image_path.jpg" class = "lazy lazy-fadein">
<div data-background = "image_path.jpg" class = "lazy lazy-fadein">
...
</div>
...
</div>