js 用延时函数来实现像鼠标移入qq头像然后会出现新的模块
就好像这功能。
代码如下
<style>
#div1{
width:50px;
height:50px;
background:red;
margin-bottom:10px;
}
#div2{
width:200px;
height:200px;
background:black;
display:none;
}
</style> <body>
<div id="div1"></div>
<div id="div2"></div> </body>
<script>
window.onload=function()
{
var div1=document.getElementById("div1");
var div2=document.getElementById('div2');
var timer=null;
div1.onmouseover= function()
{
div2.style.display='block';
}; div1.onmouseout= function()
{
clearTimeout(timer);
timer= setTimeout(function()
{
div2.style.display='none';
}, 500)
};
div2.onmouseover=function()
{
clearTimeout(timer);
};
div2.onmouseout=function(){
timer=setTimeout(function(){div2.style.display='none';},500);
} }
</script>
为什么要用延时器，
因为当移动另外一个模块时需要一定的时间，延时，鼠标能有一定的时间移到新的模块。
js 用延时函数来实现像鼠标移入qq头像然后会出现新的模块的更多相关文章
- JS中的函数、Bom、DOM及JS事件
本期博主给大家带来JS的函数.Bom.DOM操作,以及JS各种常用的数据类型的相关知识,同时,这也是JavaScript极其重要的部分,博主将详细介绍各种属性的用法和方法. 一.JS中的函数 [函数的 ...
- JS鼠标移入，移出事件
该事件的效果就像百度首页的设置选项,当鼠标移入,移出时的效果,废话不多说了,直接上码. <!DOCTYPE html><html lang="en">< ...
- 关于js判断鼠标移入元素的方向--解释
一开始我是这么想的,将待移入的元素分割四块,用mousemove获取第一次鼠标落入的区域来判断鼠标是从哪个方向进去的. 所以只要写个算法来判断鼠标的值落入该元素的区域就可以得出鼠标移入的方向,如下图: ...
- 关于js判断鼠标移入元素的方向——上下左右
一开始我是这么想的,将待移入的元素分割四块,用mousemove获取第一次鼠标落入的区域来判断鼠标是从哪个方向进去的. 所以只要写个算法来判断鼠标的值落入该元素的区域就可以得出鼠标移入的方向,如下图: ...
- html css <input> javaScript .数据类型 JS中的函数编写方式 BOM总结 DOM总结
Day27 html css div 块标签. 特点: 独占一行,有高度和宽度 span 行元素. 特点:在同一行显示,当前行满了自动去下一行显示. 不识别高度和宽度 1.1.1.1 2.输入域标签 ...
- JS DOM操作 函数 事件 阻止事件冒泡
一 函数 1.字符串函数 s.tolowerCase( ): -- 变小写 s.toupperCase( ): -- 变大写 s.substr( 2 , 8 ): -- 截取 ...
- Node.js 教程 06 - 函数
前言: 本篇介绍的是Node.js中的函数,相对于上一篇会简单一点,其实和我们Javascript中的function无异. 好了,废话不多说了,我们进入正题吧. Node.js函数: [示例1:创建 ...
- 关于js的回调函数的一点看法
算了一下又有好几个月没写博客了,最近在忙公司android的项目,所以也就很少抽时间来写些东西了.刚闲下来,我就翻了翻之前看的东西.做了android之后更加感觉到手机端开发的重要性,现在做nativ ...
- js立即执行函数
一.JS立即执行函数的写法 方式1.最前最后加括号 (function(){alert(1);}()); 方式2.function外面加括号 (function(){alert(1);})(); ...
随机推荐
- loadrunner的基本操作
一.遗留问题: 1.controller中,到设置的时间后,仍然在运行: 2.如何对多个用例的结果进行分析,找到系统可以承受的最佳的用户数量点: 3.vuser与实际的用户访问数量是一回事吗?比如vu ...
- 【C++ STL编程】queue小例子
STL是标准化组件,现在已经是C++的一部分,因此不用额外安装什么. #include <queue> #include <iostream> using namespace ...
- 前端开发环境搭建 Grunt Bower、Requirejs 、 Angular
现在web开发的趋势是前后端分离.前端采用某些js框架,后端采用某些语言提供restful API,两者以json格式进行数据交互. 如果后端采用node.js,则前后端可以使用同一种语言,共享某些可 ...
- 12-16php测试题
2． 以下哪个SQL语句是正确的( d )A:insert into users ('p001','张三','男'); B:create table (Code int primary key); C ...
- .net解决数据导出excel时的格式问题
在项目中一般都需要将报表数据导出到EXCEL中,但经常出现导出长串数据(如身份证)到EXCEL中后显示为科学计数法的格式,或者报表中显示为001的数据导出到Excel后成了1的格式. 下面简单介绍一下 ...
- CI框架引入外部css和js文件
首先在项目根目录下建立assets文件夹,在这个文件夹下再建立css和js文件夹分别放置css和js文件 然后,在项目根目录下建立.htaccess文件 内容如下: RewriteEngine on ...
- WebDriver定位元素方法
如果把页面上的元素看作人的话,在现实世界如何找到某人呢?方法有三: 一.通过人本身的属性,例如他的姓名,手机号,身份证号,性别,这些可区别他人的属性.在web页面上的元素也有这些属性,例如,id.na ...
- 阿里 RocketMQ 安装与简介
一.简介 官方简介: l RocketMQ是一款分布式.队列模型的消息中间件,具有以下特点: l 能够保证严格的消息顺序 l 提供丰富的消息拉取模式 l 高效的订阅者水平扩展能力 l 实时的 ...
- Erlang 101 Erlang环境和顺序编程
笔记系列 Erlang环境和顺序编程 Erlang并发编程 Erlang分布式编程 Yaws Erlang/OTP 日期 变更说明2014-10-12 A outline, ...
- MFC各种控件的常见操作（逐步添加中......）
由于经常切换系统或界面框架进行编程,难免有时会忘记之前的编程函数等等.所有在此自己做一个备份,以防止重新充电带来的痛苦! 1.CButton 1.1 在VC中编程实现按钮的启用(enable)和禁用( ...