简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Heim > Web-Frontend > js-Tutorial > Hauptteil

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

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





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







Verwandte Etiketten：
延迟加载 页面滚动
Quelle：php.cn
Vorheriger Artikel：网页禁止鼠标左右键功能的简单代码_javascript技巧 Nächster Artikel：JS实现的省份级联实例代码_javascript技巧
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Aktuelle Ausgaben
Die Seite kann plötzlich weder CSS noch Bootstrap abrufen Ich entwickle also eine Seite, einen Teil davon habe ich gestern gemacht und es hat großar...
Aus 2024-04-06 21:58:04
0
1
800
Wie kann man schwebende Elemente in CSS vertikal statt horizontal stapeln lassen? Ich versuche, eine Webseite mit zwei Spalten zu erstellen, mit Hauptinhalt auf der einen S...
Aus 2024-04-06 20:45:26
0
2
386
So lösen Sie das mysteriöse Leerzeichen am unteren Rand der Seite in CSS Ich versuche, mit Bootstrap und D3 eine einfache Webseite zu erstellen, weiß aber nicht, w...
Aus 2024-04-06 20:22:15
0
1
454
Laravel 8 – So leiten Sie die Route /{editable_text} zur Route /{user} um Ich habe versucht, eine Weiterleitungsroute zu erstellen, die mich zu einem Benutzerprofil...
Aus 2024-04-06 17:26:11
0
1
410
Die for-Schleife geht zufällig von 1 auf 0 Grundsätzlich kann sich die for-Schleife jedes Mal, wenn die Seite aktualisiert wird, von ...
Aus 2024-04-06 16:48:14
0
1
393
verwandte Themen
Mehr>
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！