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 相关文章推荐
比Jquery的document.ready更快的方法
Apr 28 Javascript
JS 添加千分位与去掉千分位的示例
Jul 11 Javascript
Javascript实现真实字符串剩余字数提示的实例代码
Oct 22 Javascript
js 中将多个逗号替换为一个逗号的代码
Jun 07 Javascript
基于Arcgis for javascript实现百度地图ABCD marker的效果
Sep 12 Javascript
js实现新浪微博首页效果
Oct 16 Javascript
原生js的数组除重复简单实例
May 24 Javascript
js array数组对象操作方法汇总
Mar 18 Javascript
JavaScript鼠标悬停事件用法解析
May 15 Javascript
详解JSON.stringify()的5个秘密特性
May 26 Javascript
JavaScript 防盗链的原理以及破解方法
Dec 29 Javascript
详解TS数字分隔符和更严格的类属性检查
May 06 Javascript
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
聊天室php&amp;mysql(一)
2006/10/09 PHP
php radio 单选框获取与保持值的实现代码
2010/05/15 PHP
PHP实现微信红包金额拆分试玩的算法示例
2018/04/07 PHP
在Laravel 的 Blade 模版中实现定义变量
2019/10/14 PHP
JavaScript Event学习第十一章 按键的检测
2010/02/10 Javascript
javascript学习笔记(十一) 正则表达式介绍
2012/06/20 Javascript
JavaScript中setInterval的用法总结
2013/11/20 Javascript
jQuery中.live()方法的用法深入解析
2013/12/30 Javascript
推荐10 款 SVG 动画的 JavaScript 库
2015/03/24 Javascript
JavaScript基于ajax编辑信息用法实例
2015/07/15 Javascript
JS函数的几种定义方式分析
2015/12/17 Javascript
jQuery数据类型小结(14个)
2016/01/08 Javascript
js提交form表单,并传递参数的实现方法
2016/05/25 Javascript
bootstrap table 表格中增加下拉菜单末行出现滚动条的快速解决方法
2017/01/05 Javascript
JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结(整理)
2017/06/09 jQuery
使用jQuery实现掷骰子游戏
2019/10/24 jQuery
JavaScript判断浏览器版本的方法
2019/11/03 Javascript
vue  elementUI 表单嵌套验证的实例代码
2019/11/06 Javascript
Ant Design Vue 添加区分中英文的长度校验功能
2020/01/21 Javascript
vue-列表下详情的展开与折叠案例
2020/07/28 Javascript
python使用Pycharm创建一个Django项目
2018/03/05 Python
使用Python爬了4400条淘宝商品数据,竟发现了这些“潜规则”
2018/03/23 Python
python验证码识别教程之利用滴水算法分割图片
2018/06/05 Python
Python格式化日期时间操作示例
2018/06/28 Python
Python 面向对象静态方法、类方法、属性方法知识点小结
2020/03/09 Python
Pycharm连接远程服务器过程图解
2020/04/30 Python
canvas实现滑动验证的实现示例
2020/08/11 HTML / CSS
播音主持女孩的自我评价分享
2013/11/20 职场文书
党的群众路线教育实践活动心得体会900字
2014/03/07 职场文书
小学元宵节活动总结
2015/02/06 职场文书
劳动仲裁调解书
2015/05/20 职场文书
钢铁是怎样炼成的读书笔记
2015/06/29 职场文书
大学运动会通讯稿
2015/07/18 职场文书
班级班风口号大全
2015/12/25 职场文书
个人的事迹材料怎么写
2019/04/24 职场文书
2019新学期家长会工作计划
2019/08/21 职场文书