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 相关文章推荐
js定时调用方法成功后并停止调用示例
Apr 08 Javascript
关于JavaScript命名空间的一些心得
Jun 07 Javascript
transport.js和jquery冲突问题的解决方法
Feb 10 Javascript
使用iojs的jsdom库实现同步系统时间
Apr 20 Javascript
JavaScript实现单击下拉框选择直接跳转页面的方法
Jul 02 Javascript
JavaScript代码实现禁止右键、禁选择、禁粘贴、禁shift、禁ctrl、禁alt
Nov 17 Javascript
浅析JavaScript中break、continue和return的区别
Nov 30 Javascript
深入理解 JavaScript 中的 JSON
Apr 06 Javascript
React Native如何消除启动时白屏的方法
Aug 08 Javascript
vue mint-ui 实现省市区街道4级联动示例(仿淘宝京东收货地址4级联动)
Oct 16 Javascript
javascript按顺序加载运行js方法
Dec 01 Javascript
JS实现基本的网页计算器功能示例
Jan 16 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学习之变量的使用
2011/05/29 PHP
PHP错误Parse error: syntax error, unexpected end of file in test.php on line 12解决方法
2014/06/23 PHP
PHP使用静态方法的几个注意事项
2014/09/16 PHP
php中json_encode不兼容JSON_UNESCAPED_UNICODE的解决方案
2016/05/31 PHP
教你在header中隐藏php的版本信息
2016/08/10 PHP
浅谈php中curl、fsockopen的应用
2016/12/10 PHP
RR vs IO BO3 第一场2.13
2021/03/10 DOTA
javascript加号&quot;+&quot;的二义性说明
2013/03/04 Javascript
浅析Cookie中的Path与domain
2013/12/18 Javascript
jquery使用jxl插件导出excel示例
2014/04/14 Javascript
JavaScript实现搜索框的自动完成功能(一)
2016/02/25 Javascript
jQuery中事件与动画的总结分享
2016/05/24 Javascript
JS实现鼠标移上去显示图片或微信二维码
2016/12/14 Javascript
深入理解JavaScript中的尾调用(Tail Call)
2017/02/07 Javascript
利用js查找数组中指定元素并返回该元素的所有索引示例
2017/03/29 Javascript
jQuery实现图片简单轮播功能示例
2018/08/13 jQuery
React父子组件间的传值的方法
2018/11/13 Javascript
关于Vue中axios的封装实例详解
2019/10/20 Javascript
Node.js控制台彩色输出的方法与原理实例详解
2019/12/01 Javascript
node+vue实现文件上传功能
2020/05/28 Javascript
vuex中store存储store.commit和store.dispatch的用法
2020/07/24 Javascript
使用Python脚本来控制Windows Azure的简单教程
2015/04/16 Python
Python编程中flask的简介与简单使用
2018/12/28 Python
自学python的建议和周期预算
2019/01/30 Python
浅谈Python 敏感词过滤的实现
2019/08/15 Python
windows下的pycharm安装及其设置中文菜单
2020/04/23 Python
Python代码需要缩进吗
2020/07/01 Python
python实现感知机模型的示例
2020/09/30 Python
HTML5实现移动端弹幕动画效果
2019/08/01 HTML / CSS
美丽的珠宝配饰:SmallThings
2019/09/04 全球购物
命名空间(namespace)和程序集(Assembly)有什么区别
2015/09/25 面试题
电气专业应届生求职信
2013/11/01 职场文书
电气工程师岗位职责
2014/01/01 职场文书
村级个人对照检查材料
2014/08/22 职场文书
超市收银员岗位职责
2015/04/07 职场文书
mysql 获取相邻数据项
2022/05/11 MySQL