icon logo wibloog.comWibloog
  • Teknologi
  • Otomotif
    Motor
    Mobil
  • Gadget
    Smartphone
    Apps
  • Tips dan Ulasan
  • Olah Raga
  • Fashion
  • Pendidikan
  • Kuliner
  1. Home
  2. Informasi Tentang Teknologi dan Komputer

  3. Tutorial

Cara Membuat Javascript Load Image Setelah Halaman di Scroll
  • 30 Oktober 2020
  • 379
  • Admin@Wibloog
  • Picture by : #

Cara Membuat Javascript Load Image Setelah Halaman di Scroll

How to Create Javascript Load Image After Page Scroll down

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-src pada link url gambar yang digunakan, Anda tinggal menambahkan nama class class="lazyload" loading="lazy" dan pada sumber gambar src menjadi 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

Artikel Terbaru

Realita Bersepeda di Jalan Perkotaan
Olahraga 22 Februari 2021
Realita Jadi Seorang Programmer
Teknologi dan Komputer 20 Februari 2021
Cara Beli Tiket Kereta Api di Bukalapak
Tips dan Ulasan 16 Februari 2021
7 Kelebihan iPhone Dibanding Ponsel Android
Gadget 14 Februari 2021
Iklan Web Hosting Dewaweb Lucu
Teknologi dan Komputer 13 Februari 2021
Blog Tanpa SEO Apakah Bisa Page One Google?
Teknologi dan Komputer 12 Februari 2021
Hati-Hati Kedok Penipuan Ngaku dari Lembaga Survei Lewat Telepon
Tips dan Ulasan 11 Februari 2021
Tren Harga Sawit Kampung di Tahun 2021
Tips dan Ulasan 10 Februari 2021
WhatsApp: Cara Hapus Gambar tidak Penting di iPhone
Gadget 09 Februari 2021

Komentar

Tinggalkan Komentar Disini


Artikel Terkait

Realita Jadi Seorang Programmer
Realita Jadi Seorang Programmer
Iklan Web Hosting Dewaweb Lucu
Iklan Web Hosting Dewaweb Lucu
Blog Tanpa SEO Apakah Bisa Page One Google?
Blog Tanpa SEO Apakah Bisa Page One Google?
Cara Logout Gmail Dari Device yang Pernah Digunakan
Cara Logout Gmail Dari Device yang Pernah Digunakan
Kenapa Saya Pilih Linux, Berikut ini Ulasannya
Kenapa Saya Pilih Linux, Berikut ini Ulasannya
Alasan Kenapa Banyak Orang Pakai Blogspot Untuk Cari Uang di Internet
Alasan Kenapa Banyak Orang Pakai Blogspot Untuk Cari Uang di Internet
Kenapa Backup Data Server itu Penting, Berikut ini Ulasannya
Kenapa Backup Data Server itu Penting, Berikut ini Ulasannya
Tribunnews Selalu Menduduki Halaman satu Google, Bagaimana Bisa?
Tribunnews Selalu Menduduki Halaman satu Google, Bagaimana Bisa?
Rekomendasi Macbook Bekas Tahun 2021 dengan Budget Minim
Rekomendasi Macbook Bekas Tahun 2021 dengan Budget Minim
Cara Buat Daftar Pustaka Otomatis Pakai Mendeley
Cara Buat Daftar Pustaka Otomatis Pakai Mendeley
Cara Mudah Verifikasi Domain Google Search Console Hosting Cpanel
Cara Mudah Verifikasi Domain Google Search Console Hosting Cpanel
Perkembangan Google dan Logo dari Generasi Pertama Hingga Sekarang
Perkembangan Google dan Logo dari Generasi Pertama Hingga Sekarang
10 Tips Penting SEO Gambar Yang Perlu Anda Ketahui
10 Tips Penting SEO Gambar Yang Perlu Anda Ketahui
Cara Enable Wireless di Elementary OS 5.1 Hera
Cara Enable Wireless di Elementary OS 5.1 Hera
Review Performa Komputer Mini PC HP T610 buat Harian
Review Performa Komputer Mini PC HP T610 buat Harian

Jasa Buat Blog

Tentang Kami

Wibloog adalah portal informasi yang memuat sebuah artikel yang mengulas tentang perangkat komputer, gadget, teknologi, motor, mobil, fashion, pendidikan, kuliner

Lebih Lanjut ...

Informasi Situs

Kontak
Disclaimer
Sitemap
Jasa Buat Blog
Facebook
DMCA.com Protection Status wibloog.com

© 2019 Wibloog. All Rights Reserved