HTML <img> loading -ominaisuus
Määrittely ja käyttö
loading
Property määrittää, ladataanko kuva välittömästi vai lykätetäänkö sen lataaminen näytön ulkopuolelle, kunnes esimerkiksi käyttäjä pyörittää niiden läheisyyteen.
Vinkki:Vain loading="lazy"
Lisää kuvat, jotka sijaitsevat näytön alla.
Esimerkki
Lisää viivytetty lataus ensimmäisen näytön alakuvan lisäämiseksi:
<img src="/i/photo/beijing.jpg" alt="北京" style="width:100%"> <img src="/i/photo/shanghai.jpg" alt="上海" style="width:100%"> <-- Kuva näytön ulkopuolella --> <img src="/i/photo/wuhan.jpg" alt="武汉" style="width:100%" loading="lazy"> <img src="/i/photo/shanghai-1.jpg" alt="上海" style="width:100%" loading="lazy"> <img src="/i/photo/shanghai-2.jpg" alt="上海" style="width:100%" loading="lazy"> <img src="/i/photo/shanghai-3.jpg" alt="上海" style="width:100%" loading="lazy"> <img src="/i/photo/tiyugongyuan.jpg" alt="体育公园" style="width:100%" loading="lazy">
Syntaksi
<img src="URL" loading="eager|lazy">
Atribuuttiarvo
Arvo | Kuvaus |
---|---|
eager | Oletus. Lataa kuvat välittömästi. |
lazy | Lataa kuvia viivytetysti, kunnes tiettyjä ehtoja täytetään. |
Selaimen tuki
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
77.0 | 79.0 | 75.0 | Ei tuettu | 64.0 |