手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >js判断鼠标同时离开两个div的思路及代码
js判断鼠标同时离开两个div的思路及代码
摘要:纠结了两天,憋出了个蛋,欢迎拍砖!!!复制代码代码如下:无标题文档ul{margin:0;padding:0}li{position:rel...

纠结了两天,憋出了个蛋,欢迎拍砖!!!

复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<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">

ul{margin:0;padding:0}

li{position:relative;margin:0;padding:0;;}

.grid{background:#ccc;width:100px;height:100px;;}

.f{background:#333;width:200px;height:200px;position:absolute;top:0;left:100px; display:none}

</style>

<script type="text/javascript" src="http://mat1.gtimg.com/www/js/tcomment/jquery-1.6.2.min.js"></script>

<script type="text/javascript">

jQuery(function(){

window.a=0; window.b=1 ; //同为1隐藏弹层

$('ul').delegate('.grid','mouseover',function(){ // 鼠标放在头像上

if($('.f')){

$('ul').append('<div></div>')

$('.f').css({top:$(this).offset().top})

}

window.a=0;

$('.f').show();

})

$('ul').delegate('.f','mouseover',function(){// 鼠标在弹层上

window.b=0;

});

$('ul').delegate('.grid','mouseout',function(){// 鼠标离开头像

window.a=1;

})

$('ul').delegate('.f','mouseout',function(){// 离开弹层

window.b=1;

});

setInterval(function(){//console.log(window.a +" "+ window.b +" "+ window.c);

if(window.a&&window.b){

$('.f').hide();

}

},100)

})

</script>

</head>

<body>

<ul>

<li><div></div></li>

<li><div></div></li>

<li><div></div></li>

<li><div></div></li>

<li><div></div></li>

<li><div></div></li>

<li><div></div></li>

<li><div></div></li>

<li><div></div></li>

<li><div></div></li>

</ul>

</body>

</html>

【js判断鼠标同时离开两个div的思路及代码】相关文章:

js实现文本框选中的方法

jquery判断至少有一个checkbox被选中的方法

鼠标图片振动代码

判断file框选择的是否为图片

js判断鼠标位置是否在某个div中的方法

JSON字符串和对象之间的转换详解

判断是否输入完毕再激活提交按钮

判断checkbox选择的个数 多浏览器

jQuery获取上传文件的名称的正则表达式

js鼠标事件

精品推荐
分类导航