masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > tutorial js > 原生Js页面滚动延迟加载图片实现原理及过程_javascript技巧

原生Js页面滚动延迟加载图片实现原理及过程_javascript技巧

WBOY
Lepaskan： 2016-05-16 17:31:33
asal
1078 orang telah melayarinya
原理和过程
1.页面滚动加载事件
2.获取元素在页面里的top值 根据滚动条的位置 判断何时显示图片
3.获取元素集合 加载过的图片从集合里删除
效果预览：http://jsfiddle.net/dtdxrk/SkYNq/embedded/result/
复制代码 代码如下:





原生Js页面滚动延迟加载图片







Label berkaitan：
Malas memuatkan Menatal halaman
sumber：php.cn
Artikel sebelumnya：网页禁止鼠标左右键功能的简单代码_javascript技巧 Artikel seterusnya：JS实现的省份级联实例代码_javascript技巧
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
Halaman tiba-tiba tidak dapat menarik css atau bootstrap Jadi saya sedang membangunkan halaman, saya telah membuat sebahagian daripadanya semalam d...
daripada 2024-04-06 21:58:04
0
1
800
Bagaimana untuk membuat elemen terapung disusun secara menegak dan bukannya secara mendatar dalam CSS? Saya cuba membuat halaman web dengan dua lajur, dengan kandungan utama di satu pihak dan k...
daripada 2024-04-06 20:45:26
0
2
386
Bagaimana untuk menyelesaikan ruang kosong misteri di bahagian bawah halaman dalam CSS Saya cuba membina halaman web mudah menggunakan Bootstrap dan D3, tetapi saya tidak tahu b...
daripada 2024-04-06 20:22:15
0
1
454
Laravel 8 - Cara mengubah hala /{editable_text} laluan ke /{user} route Saya telah cuba membuat laluan ubah hala untuk membawa saya ke profil pengguna. Laluan uba...
daripada 2024-04-06 17:26:11
0
1
410
untuk gelung secara rawak pergi dari 1 hingga 0 Pada asasnya, setiap kali halaman dimuat semula, gelung for berpotensi berubah daripada 1 ...
daripada 2024-04-06 16:48:14
0
1
393
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan