社区
JavaScript
帖子详情
网页文字列表、内容如何实现懒加载效果?
xiaosong2008
2018-03-22 09:15:08
我现在做的一个项目,由于数据量比较大,首页页面是取JSON数据(由我写的一个程序定时生成),用JS组合、拼接而成,展示的是列表文字。
正是由于数据量比较大,所以我还想在首页上加上懒加载效果,即往下滑动滚动条时,列表文字逐渐加载。
希望大家给些思路和提示,请大家帮忙!
...全文
933
1
打赏
收藏
网页文字列表、内容如何实现懒加载效果?
我现在做的一个项目,由于数据量比较大,首页页面是取JSON数据(由我写的一个程序定时生成),用JS组合、拼接而成,展示的是列表文字。 正是由于数据量比较大,所以我还想在首页上加上懒加载效果,即往下滑动滚动条时,列表文字逐渐加载。 希望大家给些思路和提示,请大家帮忙!
复制链接
扫一扫
分享
转发到动态
举报
AI
作业
写回复
配置赞助广告
用AI写文章
1 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
孟子E章
2018-03-22
打赏
举报
回复
网上有现成的 参考 http://www.jb51.net/article/104904.htm https://www.oschina.net/code/snippet_1780998_52619 http://www.jb51.net/article/76645.htm
模仿微信朋友圈 图片浏览 h5 html5 js 不需要jquery 纯js
模仿微信朋友圈 图片浏览 h5 html5 js 不需要jquery 纯js
调用百度地图API显示虚线运动轨迹
调用百度地图API显示虚线运动轨迹,自己写的一个例子,附带注释,适合初次接触百度地图API的
bigautocomplete文本搜索和自动补全控件
JQuery插件:bigautocomplete文本搜索和自动补全控件,已经转码为utf-8。
网页
内容
如何
懒加载
懒加载
是一种
网页
优化技术,可以减少页面初次加载时需要下载的资源量,提高页面加载速度。
懒加载
的核心思想就是将
网页
的资源(例如图片、视频等)延迟加载,只有当用户需要滚动页面到该资源的位置时才开始加载。需要注意的是,在
实现
懒加载
时,需要权衡页面的加载速度和用户用于享受资源的时间,以确保在用户需要资源时加载足够快,同时避免用户太早看到空白页面。假设有一篇博客页面,页面上包含多张图片,其中有些图片非常大,加载时间较长,影响页面的加载速度和用户体验。
懒加载
实现
方式
首先将页面上的图片的 src 属性设为 loading.gif,而图片的真实路径则设置在 data-src 属性中,页面滚动的时候计算图片的位置与滚动的位置,当图片出现在浏览器视口内时,将图片的 src 属性设置为 data-src 的值,这样,就可以
实现
延迟加载。定义:延迟加载也称为惰性加载,
懒加载
,即在长
网页
中延迟加载图像。举个例子,当打开淘宝首页的时候,只有在浏览器窗口里的图片才会被加载,当你滚动首页向下滑的时候,进入视口内的图片才会被加载,而其它从未进入视口的图像不会也不会加载。
JavaScript
87,992
社区成员
224,698
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章