在一个网页的页面有很多图片列表的时候，如果一次性加载全部的图片，会浪费很多资源，而且页面速度也会变慢。一个页面图片比较多，需要滚动来查看，但有时候用户只会查看前一部分，后面的图片就不会看了，采用一次性加载全部图片，会浪费很多资源。下面就来介绍下如何用jquery实现页面滚动图片元素动态加载，就是每次滚动出来的图片才开始加载，后面的先不加载
工具/原料
1
jquery以及滚动插件
2
浏览器
方法/步骤
1
首先新建一个html测试页面，复制一个html空白骨架。添加上多个图片标签列表，用来测试滚动效果，所以建议在十张左右，这里的
标签里的图片路径不要用src而是data-url（这个属性是插件处理的，如果是src，默认浏览器就全部加载了）
2
引入jquery库和jquery.scrollLoading插件（我这里是演示，所以就引入了本地目录路径了）
3
为了便于图片居中显示，添加了一个样式属性，不添加，也不影响测试结果
4
上面几步都准备好之后，最后添加滚动图片初始化代码
5
打开浏览器测试页面看效果，图片正常展示了。滚动鼠标往下翻，可以看到图片都展示出来了。光从这个页面，也许你看不出来是随着滚动依次加载的，按F12打开调试工具
6
选择Network，下面可以看到图片加载请求，现在可以一边滚动图片一边查看请求，会发行每次滚动都会依次加载1到2张图片，不滚动不加载。
注意事项
初学者，建议按照上面的步骤亲自试一遍，比看一遍要深刻的多
下一篇：Axure设计：晋级轮播图