前端学习 第七弹: Javascript实现图片的延迟加载

为了实现图片进入视野范围才开始加载首先:

<img    src="" x-src="/acsascasc.jpg">

这时src是空的没有加载图片

$(window).scroll(function (){
$("img").each(function(){
if ($(this).src == ""){
if ( ($(this).offset().top + $(this).width()/2)<($(window).height()+$(window).scrollTop() ) ){
$(this).attr("src",$(this).attr("x-src"));
}
}
}); });

$().attr(,)    设置并返回元素的某个属性

前端学习 第七弹: Javascript实现图片的延迟加载的更多相关文章

  1. 前端学习 第六弹: javascript中的函数与闭包

    前端学习 第六弹:  javascript中的函数与闭包 当function里嵌套function时,内部的function可以访问外部function里的变量 function foo(x) {   ...

  2. 前端学习 第三弹: JavaScript语言的特性与发展

    前端学习 第三弹: JavaScript语言的特性与发展 javascript的缺点 1.没有命名空间,没有多文件的规范,同名函数相互覆盖 导致js的模块化很差 2.标准库很小 3.null和unde ...

  3. 前端学习 第四弹: HTML(一)

    前端学习 第四弹: HTML(一) 元素分类:块元素 内联元素 块级元素在浏览器显示时,通常会以新行来开始(和结束). 例子:<h1>, <p>, <ul>, &l ...

  4. 前端学习 第五弹: CSS (一)

    前端学习 第五弹: CSS (一) 创建css: <link rel="stylesheet" type="text/css" href="my ...

  5. web前端学习之HTML CSS/javascript之一

    前端编码之路之坎坷,web前端应该一直是个战场吧,各种浏览器的不兼容,各种小细节的修改,要往一个好的产品经理方向走,实在是难,昨天听了一位十年经验的产品经理讲座,最重要的恐怕就是协调资源的能力,而协调 ...

  6. Web前端学习(4):显示图片、url与文件路径

    本章主旨 介绍<img>标签及其基本属性:介绍URL和文件路径 在上一章中,我简单地介绍了HTML的一些基本标签及基本属性,例如,我们用<p>标签来标记文本段落,用<h1 ...

  7. webpack学习(七)打包压缩图片

    使用插件webpack-spritesmith生成雪碧图 1.安装webpack-spritesmith:npm install --save-dev webpack-spritesmith 2.配置 ...

  8. web前端学习(四)JavaScript学习笔记部分(8)-- JavaScript瀑布流

    index.html <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type&qu ...

  9. web前端学习(四)JavaScript学习笔记部分(8)-- JavaScript 浏览器对象

    1.window对象 1.1.window对象: window对象是BOM的核心,window对象指当前的浏览器窗口 所有javaScript全局对象.函数以及变量均自动生成为window对象的成员 ...

随机推荐

  1. XPath

    XPath即为XML路径语言,它是一种用来确定XML(标准通用标记语言的子集)文档中某部分位置的语言.XPath基于XML的树状结构,提供在数据结构树中找寻节点的能力. XPath的需要理解的相关概念 ...

  2. testlink安装

    今天安装了一下testlink,完全按照高峻博客里的做法,最后安装成功了 遇到的问题: 问题表现: 新安装TestLink,登录Testlink后,新建一个项目后,会出现如下提示: There are ...

  3. IOS 设置导航栏

    //设置导航栏的标题 self.navigationItem setTitle:@"我的标题"; //设置导航条标题属性:字体大小/字体颜色…… /*设置头的属性:setTitle ...

  4. java第一天学习作业及答案

    作业一 一.选择题 1.选出在java中有效的注释声明(AD)(选两项) A.//这是注释 B.*/这是注释*/ C./这是注释 D./*这是注释*/ 2.在控制台运行一个java程序,使用的命名正确 ...

  5. MySQL主从复制与读写分离

    MySQL主从复制(Master-Slave)与读写分离(MySQL-Proxy)实践 Mysql作为目前世界上使用最广泛的免费数据库,相信所有从事系统运维的工程师都一定接触过.但在实际的生产环境中, ...

  6. C# Tostring格式

    开发中经常用到格式化,不管是时间.货币.数字都可以随心所欲.也许你用的是{0:C}方式,也许你用String.Format方式,也许你用.ToString("n"),都是格式化的方 ...

  7. 在VBA中新建工作簿

    用程序计算数据,得到不同公司.不同项目的数据结果,最终还要将每个公司的数据结果放在各自的单独文件中.这就需要在vba中新建.保存excel文件.掌握几个东西就能很熟练了:1.要想保存在当前目录下,需要 ...

  8. VS属性页的目录类型

    常用的三个: 1.可执行目录 :在其中搜索可执行文件的目录. 对应于 PATH 环境变量,即为.dll的目录. 2.包含目录    :在其中搜索源代码中所引用的包含文件的目录. 对应于 INCLUDE ...

  9. loadRunner录制脚本常见问题及解决方法

    1.是用IE9录制IE浏览器异常关闭 系统:win7 LR:11 浏览器:IE9 lr使用IE9录制脚本时,浏览器异常关闭且lr报the recording of the application wa ...

  10. IOS中延迟执行的几种方法

    前几天去国美在线面试,就遇到了上面的问题,当时是笔试,只写出来了第一种方法,现在整理了一下. //1.performSelector方法:在当前线程中执行的方法,使用默认模式,并延迟执行@select ...