js简单实现图片延迟加载的方法


Posted in Javascript onJuly 19, 2016

本文实例讲述了js简单实现图片延迟加载的方法。分享给大家供大家参考,具体如下:

window.onload=window.onresize=window.onscroll=function()
{
  showImg();
};
function getPos(obj)
{
  var l=0;
  var t=0;
  while(obj)
  {
    l+=obj.offsetLeft;
    t+=obj.offsetTop;
    obj=obj.offsetParent;
  }
  return {left: l, top: t};
}
function showImg()
{
  var aTmg=document.getElementsByTagName('img');
  var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;
  var scrollBottom=scrollTop+document.documentElement.clientHeight;
  for(var i=0;i<aTmg.length;i++)
  {
    var p=getPos(aTmg[i]);
    if(p.top<scrollBottom)
    {
      //alert(aTmg);
      aTmg[i].src=aTmg[i].getAttribute('_src');
    }
  }
}

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript判断单选框或复选框是否选中方法集锦
Apr 04 Javascript
jquery遍历input取得input的name
Apr 27 Javascript
不同浏览器的怪癖小结
Jul 11 Javascript
js 将json字符串转换为json对象的方法解析
Nov 13 Javascript
js实现顶部可折叠的菜单工具栏效果实例
May 09 Javascript
js模拟微博发布消息
Feb 23 Javascript
js实现图片轮播效果学习笔记
Jul 26 Javascript
js原生方法被覆盖,从新赋值原生的方法
Jan 02 Javascript
详解js的作用域、预解析机制
Feb 05 Javascript
详解Angular中通过$location获取地址栏的参数
Aug 02 Javascript
js实现计时器秒表功能
Dec 16 Javascript
jQuery实现二级导航菜单的示例
Sep 30 jQuery
JS实现输入框提示文字点击时消失效果
Jul 19 #Javascript
JavaScript新增样式规则(推荐)
Jul 19 #Javascript
JavaScript动态添加css样式和script标签
Jul 19 #Javascript
javascript中使用未定义变量或值的情况分析
Jul 19 #Javascript
js基于cookie记录来宾姓名的方法
Jul 19 #Javascript
jQuery悬停文字提示框插件jquery.tooltipster.js用法示例【附demo源码下载】
Jul 19 #Javascript
使用plupload自定义参数实现多文件上传
Jul 19 #Javascript
You might like
在“咖啡之国”感受咖啡文化
2021/03/03 咖啡文化
分享一个PHP数据流应用的简单例子
2012/06/01 PHP
解析如何用php screw加密php源代码
2013/06/20 PHP
php删除一个路径下的所有文件夹和文件的方法
2018/02/07 PHP
jquery实现居中弹出层代码
2010/08/25 Javascript
jquery实现点击页面计算点击次数
2015/01/23 Javascript
jQuery模拟新浪微博首页滚动效果的方法
2015/03/11 Javascript
js实现表单多按钮提交action的处理方法
2015/10/24 Javascript
javascript截图 jQuery插件imgAreaSelect使用详解
2016/05/04 Javascript
Node.js常用工具之util模块
2017/03/09 Javascript
Vue axios 中提交表单数据(含上传文件)
2017/07/06 Javascript
探究react-native 源码的图片缓存问题
2017/08/24 Javascript
Node.js学习之查询字符串解析querystring详解
2017/09/28 Javascript
原生JS实现网页手机音乐播放器 歌词同步播放的示例
2018/02/02 Javascript
Vue组件之高德地图地址选择功能的实例代码
2019/06/21 Javascript
微信小程序使用蓝牙小插件
2019/09/23 Javascript
python下调用pytesseract识别某网站验证码的实现方法
2016/06/06 Python
利用Python自动监控网站并发送邮件告警的方法
2016/08/24 Python
python去掉空白行的多种实现代码
2018/03/19 Python
Python从使用线程到使用async/await的深入讲解
2018/09/16 Python
windows下 兼容Python2和Python3的解决方法
2018/12/05 Python
Python matplotlib通过plt.scatter画空心圆标记出特定的点方法
2018/12/13 Python
Python 多个图同时在不同窗口显示的实现方法
2019/07/07 Python
python GUI库图形界面开发之PyQt5单行文本框控件QLineEdit详细使用方法与实例
2020/02/27 Python
keras 获取某层输出 获取复用层的多次输出实例
2020/05/23 Python
Django CBV模型源码运行流程详解
2020/08/17 Python
基于HTML5陀螺仪实现ofo首页眼睛移动效果的示例
2017/07/31 HTML / CSS
微软美国官方网站:Microsoft美国
2018/05/10 全球购物
韩国演唱会订票网站:StubHub韩国
2019/01/17 全球购物
澳大利亚宠物食品和用品商店:PETstock
2020/01/02 全球购物
庆元旦迎新年广播稿
2014/02/18 职场文书
厨师个人自我鉴定范文
2014/04/19 职场文书
2014年人大工作总结
2014/12/10 职场文书
中学生学习保证书
2015/02/26 职场文书
赵氏孤儿观后感
2015/06/09 职场文书
MySQL数据库 安全管理
2022/05/06 MySQL