css 包含的图片和style="display:none"可以避免图片加载,可以节省网络流量
从别人那儿学到一招:先记录下来:
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.useless{
background-image: url(/kk/image/001.jpg);
}
.hidden{
background-image: url(/kk/image/002.jpg);
}
.none{
background-image: url(/kk/image/003.jpg);
}
.parentHidden{
background-image: url(/kk/image/004.jpg);
}
.parentNone{
background-image: url(/kk/image/005.jpg);
}
</style>
</head>
<body>
<div class="hidden"></div> <div class="none"></div> <div style="visibility:hidden;">
<div class="parentHidden"></div>
</div> <div style="display:none;">
<div class="parentNone"></div>
</div> <div style="display:none">
<img src="/kk/image/006.jpg"></div>
</body>
只有001.jpg和005.jpg图片未加载出来
详细参见firebug 的监视图:

css 包含的图片和style="display:none"可以避免图片加载,可以节省网络流量的更多相关文章
- js 页面图片等元素在普通元素中滚动动态加载技术
/*! * 2012-01-13 v1.1 偏移值计算修改 position → offset * 2012-09-25 v1.2 增加滚动容器参数, 回调参数 * 2015-11-17 v1.3 只 ...
- 此编译单元不包含在frame元数据中指定的factoryClass,无法加载配置的运行时共享库
警告:此编译单元不包含在frame元数据中指定的factoryClass,无法加载配置的运行时共享库.要在没有运行时共享库的情况下进行编译,请将 -static-link-runtime-shared ...
- html display和visibility在资源加载上的区别
想要把一个html里的UI组件设置为可见/不可见,可以用两个属性,display=none/block, visibility=hidden/visible, 网上的解释是display虽然可以让一个 ...
- 解决swfupload改变display属性后flash重新加载的问题(chome,safari内核的所有浏览器)
最近在做的项目中有要用到上传控件,所有就用到了swfupload flash上传控件 因为在项目中要使用到Tab控件,tab控件通过改变display属性来控制tab页的显 示与隐藏.当swfuplo ...
- Android应用程序开发之图片操作(二)——工程图片资源的加载及OOM的处理
(一)工程图片资源的加载方法 在Android应用程序开发之图片操作(一)中,详细说明了如何操作各种资源图片,只是有的没有附上示例代码,在此,我将针对项目工程中的图片资源的显示加载进行说明.官方说明, ...
- 图片没有.png或者jpg后缀能不能加载?
是可以的,如:http://mmbiz.qpic.cn/mmbiz_png/MW1VecOrnw6HUMvEUNUxibLVtbY2vHF8QkFyviaickh8pnsapQ8gOosdq13SBX ...
- JavaScript——图片懒加载
前言 有一个朋友问我这个问题,刚好有时间,现在就简单的写个Demo~ github | https://github.com/wangyang0210/bky/tree/picLoadLazy 内容 ...
- 用javascript预加载图片、css、js的方法研究
预加载的好处可以让网页更快的呈现给用户,缺点就是可能会增加无用的请求(但图片.css.js这些静态文件可以被缓存),如果用户访问的页面里面的css.js.图片被预加载了,用户打开页面的速度会快很多,提 ...
- Javascript图片预加载详解 分类: JavaScript HTML+CSS 2015-05-29 11:01 768人阅读 评论(0) 收藏
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...
随机推荐
- linux tar 增量备份命令
tar --newer-mtime "2013-09-17 00:00:00" -zcvf /var/www/good.tar.gz spider/
- outlook 用宏发邮件
经常发面试邮件,通常只是修改一下收件人邮箱地址,和收件人姓名,其他全部一致,有木有发现每次都用用outlook写邮件很麻烦? 使用宏发邮件,就会不麻烦了,直接修改下称呼,修改下收件人地址,按下F5,就 ...
- JMETER JDBC操作
本文目标 1.添加测试计划 2.配置JDBC连接 3.插入数据 4.使用控制器 5.查看插入结果 1.添加测试计划 添加mysql驱动 2.添加测试计划 3.添加JDBC连接 在这里JDB ...
- POJ 2771 二分图(最大独立集)
Guardian of Decency Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 5244 Accepted: 21 ...
- hdu 4632 Palindrome subsequence
http://acm.hdu.edu.cn/showproblem.php?pid=4632 简单DP 代码: #include<iostream> #include<cstdio& ...
- 二模 (7) day1
第一题: 题目大意: 给出数轴上N棵树的坐标和高度,如果两棵树之间的距离小于其中一颗树的高度,那么就有树会被挡住.因此要把一些树砍矮一点.求砍树的总高度最小值. N<=100000; 解题过程: ...
- 4通用Makefile编写
a.c #include<stdio.h> #include "a.h" int main() { printf("hello world\n"); ...
- Quartz2D
http://donbe.blog.163.com/blog/static/138048021201052093633776/ 详解 代码如下: DJView 绘制线段 基本图形 // // DJVi ...
- 站在K2角度审视流程--任务的独占与释放
应用场景一:某件事情由A.B两人(或者更多人)完成,任务开始后,两人随时可以处理任务,只需有一人处理完成,此事情即可结束. 应用场景二:某件事情由A.B两人(或者更多人)完成,任务开始后,两人随时可以 ...
- cvWaitKey
OpenCV中的一个函数 函数原型为: C++: int waitKey(int delay=0) Python: cv2.waitKey([delay]) → retval C: int cvWai ...