图片预加载的实现

  1. 使用jQuery图片预加载插件Lazy Load

    加载jQuery, 与jquery.lazyload.js
    设置图片的占位符为data-original, 给图片一个特别的标签,比如class=".lazy"
    然后延迟加载: $(‘img.lazy’).lazyload();这个函数可以选择一些参数:
    图片预先加载距离:threshold,通过设置这个值,在图片未出现在可视区域的顶部距离这个值时加载。
    事件绑定加载的方式:event
    图片限定在某个容器内:container

  2. 使用js实现图片加载:

    就是new一个图片对象, 绑定onload函数, 赋值url

  3. 用CSS实现图片的预加载

    写一个CSS样式设置一批背景图片,然后将其隐藏
    改进: 使用js来推迟预加载时间, 防止与页面其他内容一起加载

  4. 用Ajax实现预加载

    其实就是通过ajax请求请求图片地址. 还可以用这种方式加载css,js文件等

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值