1. 首页
  2. 编程语言
  3. Javascript
  4. js图片加载效果实例代码(延迟加载+瀑布流加载)

js图片加载效果实例代码(延迟加载+瀑布流加载)

上传者: 2021-12-07 00:35:22上传 PDF文件 94.90 KB 热度 14次

主要做了两种图片加载的效果一种是遇到页面图片比较多的时候,带读条效果的加载提示另外一种是根据滑块的位置进行图片的预加载,在用户不察觉的情况下,实现瀑布流的加载效果主要思路:。HTML结构很简单,就是一个div.picList包裹了所有img,然后加上一个简单的进度条div#loadBarcsscss里面需要注意的地方有两个:。HTML和前面部分相同,只是把src写成正常地址即可。js部分比较捉急的就是scrollTop、height那几个值的取值对象,总是记不清楚,所以按照js和jquery都写上了,以后可以直接用。将数值关系搞定之后,只要满足条件就触发加载即可。

用户评论