Cara Membuat Javascript Load Image Setelah Halaman di Scroll

Cara Membuat Javascript Load Image Setelah Halaman di Scroll
1.6 K View • 30 Oktober 2020
Picture by : # • Post by : Admin@wirneet

Salah satu alternatif untuk mempercepat proses halaman website adalah membuat loading gambar diakhir, setelah semua halaman web ditamplkan kemudian baru selanjutnya menampilkan gambar, agar halaman yang diakses tidak membutuhkan waktu yang lama.

Trik ini banyak dipakai di berbagai situs, karena dapat meningkatkan optimasi server, selain itu website yang memilki akses yang sangat cepat itu sangat disukai oleh pengunjung dan mesin pencari Google.

Kali ini penulis akan memberkan contoh, cara bagaimana gambar pada website dapat di load saat discroll, tips ini sudah saya terapkan diversi mobile.

Pada tutorial kali ini menggunakan lazysizes, salah satu library yang banyak dipakai untuk melakukan load image web dengan menggunakan data-src dan class yang disediakan.



Code HTML Load Image Setelah Halaman di Scroll

Berikut dibawah ini contoh Code HTML Load Image Scrollnya



Yang perlu diperhatikan adalah pada bagian class dan data-data-src pada link url gambar yang digunakan, Anda tinggal menambahkan nama class class="lazyload" loading="lazy" dan pada sumber gambar data-src menjadi data-data-src

Jika ingin terapkan di website Anda, silakan tambahkan bagian fungsi javascript seperti dibawah ini, Seperti terlihat pada contoh kode full diatas.



Demikian tutorial ini kami buat, Terima kasih terlah berkunjung di artikel kami, Selamat mencoba






Penulis
Jumadi
Sumatra, Indonesia Jumadi adalah seorang IT Konsultan di Bidang Perkebunan Kelapa Sawit yang berasal dari Kota Medan, Sumatra ia merupakan lulusan Teknik Informatika di STMIK AKAKOM Yogyakarta, yang kini menjadi Universitas UTDI, ketertarikan menulis menjadi salah satu inspirasi untuk berbagi informasi dan ilmu pengetahuan dari pengalaman bekerja. Dengan pengalaman tersebut Jumadi menyempatkan di sela - sela waktu luang dengan menulis konten artikel SEO yang mengutamakan originalisasi. Hampir semua topik konten di sukai, mulai tentang iptek, otomotif, olahraga, pertanian, gadget dan pendidikan. Saat ini ia bekerja sebagai IT Konsultan di salah satu perusahaan pengembang software perkebunan kelapa sawit.
in

Artikel Terkait


Ada 0 Komentar di "Cara Membuat Javascript Load Image Setelah Halaman di Scroll"


Tinggalkan Komentar Disini


Artikel Terbaru

Fintech 1 week ago
Motor 2 weeks ago
Gadget 2 weeks ago
Fintech 2 weeks ago
Tekno 2 weeks ago
Tekno 3 weeks ago
Gadget 3 weeks ago