Javascript实现两张图片的延迟加载
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
div
{
float: left;
margin: 10px;
} #div1
{
width: 90px;
height: 50px;
background-color: red;
} #div2
{
width: 250px;
height: 200px;
background-color: grey;
display: none;
}
</style>
<script type="text/javascript">
window.onload = function () {
var oDiv1 = document.getElementById('div1');
var oDiv2 = document.getElementById('div2'); oDiv1.onmouseover = function () {
setTimeout(function () {
oDiv2.style.display = "block";
}, 100); };
var a
oDiv1.onmouseout = function () {
a = setTimeout(function () {
oDiv2.style.display = "none";
}, 1000); }; oDiv2.onmouseover = function () {
clearTimeout(a);
}
oDiv2.onmouseout = function () {
setTimeout(function () {
oDiv2.style.display = "none";
}, 100);
}
}
</script>
</head>
<body>
<div id="div1"></div>
<div id="div2"></div>
</body>
</html>
Javascript实现两张图片的延迟加载的更多相关文章
- 使用CSS3中Canvas 实现两张图片合成一张图片【常用于合成二维码图片】
CSS3 Canvas 实现两张图片合成一张图片 需求 需求:在项目中遇到将一张固定图片和一张二维码图片合成一张新图片,并且用户能够将图片保存下载到本地. 思路:使用 CSS3 中的 Canvas 将 ...
- opencv_判断两张图片是否相同
QQ:231469242 pip install opencv 如果找不到版本,去非官方下载opencv第三方包http://www.lfd.uci.edu/~gohlke/pythonlibs/ 下 ...
- VS Code - Debugger for Chrome调试JavaScript的两种方式
VS Code - Debugger for Chrome调试JavaScript的两种方式 最近由于出差的缘故,博客写的不是很多,一直想写一篇VS Code - Debugger for Chrom ...
- javascript使用两个逻辑非运算符(!!)的原因
javascript使用两个逻辑非运算符(!!)的原因: 在有些代码中可能大家可能会注意到有些地方使用了两个逻辑非运算符,第一感觉就是没有必要,比如操作数是true的话,使用两个逻辑非的返回值还是tr ...
- HTML两张图片叠加问题的进一步修改
要想两张图片叠加,只需在circle添加一个Position:absolute就OK了 以上几步,很多大侠前辈都已经说过,相信不用再啰嗦,我想说的是一种扩展,将示例放到右边,可能因为我悟性低,研究了一 ...
- javascript保留两位小数
原文地址http://blog.csdn.net/he20101020/article/details/8503308 <script type="text/javascrip ...
- JavaScript获取两个时间的时间差
<html><head><title>JavaScript计算两个时间差</title><meta http-equiv="conten ...
- Java 比较两张图片的相似度
import java.awt.image.BufferedImage; import java.io.File; import javax.imageio.ImageIO; /** * 比较两张图片 ...
- iOS把两张图片合成一张图片
0x00 步骤 先读取两张图片把创建出CGImageRef 创建上下文画布 把图片依次画在画布指定位置上 从上下文中获得合并后的图片 关闭上下文 释放内存 0x01 代码实现 - (void)comp ...
随机推荐
- C++中extern “C”含义深层探索
C++中extern “C”含义深层探索 extern “C” 是一个双向都需要用到的语法表示,就是说在cpp引用c头文件,或者c引用cpp文件时都需要用到.但extern “C” 永远只能在cpp引 ...
- 关于CORS
前几天碰到CORS问题,只要在“Access-Control-Allow-Origin”响应头中添加对应域名即可. 今天做一个上传文件的demo,利用XMLHttpRequest向服务器发送post请 ...
- C#工具介绍
VisualStudio是微软的官方提供的.NET开发工具. 除了VisualStudio外,还有一些开源的.NET开发IDE. MonoDevelop.SharpDevelop等. 开发未必需要使用 ...
- c++11: bind用法
原型: template< class R, class F, class... Args > bind( F&& f, Args&&... args ); ...
- ThreadLocal学习记录
ThreadLocal简介 当使用ThreadLocal维护变量时,ThreadLocal为每个使用该变量的线程提供独立的变量副本,所以每一个线程都可以独立地改变自己的副本,而不会影响其它线程所对应的 ...
- Eclipse 运行多个Tomcat实例
- git管理和自动部署项目
当一个项目需要纳入到版本控制的时候,选择的工具还是比较多的,最常见的就是工具有CVS,SVN,GIT等.在平时的开发中视情况而定,从来就没有最好的版本控制工具,只有最适合的工具.在这里我习惯用git来 ...
- java的JVM机制
1.jre:java运行环境 提供一个JVM和一些基础类库.2.只安装jre以后,机器就具备了运行java程序的条件.但是不具备开发java程序的条件.安装JDK以后,在c:/program file ...
- ESB概述
ESB概念的提出: 企业有大量的异构的业务系统,这些系统之间需要通过web service来交互数据,这样的话可以想象系统直接的交互关系是蜘蛛网状的,是难以维护的.这时候提出了ESB,每个业务系统只需 ...
- 6、WPF中的特殊字符与空白
特殊字符: 小于号 < 字符实体采用<表示 大于号 > 字符实体采用>表示 &符号 字符实体采用&表示 引号"&quo ...