HTML <img> memuat Atribut
Contoh
Tambahkan pemuatan lambat ke gambar di paruh bawah:
<img src="/w3images/wedding.jpg" alt="Wedding" style="width:100%">
<img
src="/w3images/rocks.jpg" alt="Rocks" style="width:100%">
<!--
off-screen images -->
<img src="/w3images/paris.jpg" alt="Paris"
style="width:100%" loading="lazy">
<img src="/w3images/nature.jpg"
alt="Nature" style="width:100%" loading="lazy">
<img src="/w3images/underwater.jpg"
alt="Underwater" style="width:100%" loading="lazy">
<img src="/w3images/ocean.jpg"
alt="Ocean" style="width:100%" loading="lazy">
<img src="/w3images/mountainskies.jpg"
alt="Mountains" style="width:100%" loading="lazy">
Definisi dan Penggunaan
Atribut loading
menentukan apakah browser harus segera memuat gambar atau menunda pemuatan gambar di luar layar hingga misalnya pengguna menggulir di dekatnya.
Tip: Tambahkan loading="lazy"
hanya ke gambar yang diposisikan di paro bawah.
Dukungan Peramban
Attribute | |||||
---|---|---|---|---|---|
loading | 77.0 | 79.0 | 75.0 | Not Supported | 64.0 |
Sintaksis
<img src="URL" loading="eager|lazy">
Nilai Atribut
Value | Description |
---|---|
eager | Default. Loads an image immediately |
lazy | Defer loading of images until some conditions are met |
HTML <img> tag