js判断鼠标同时离开两个div的思路及代码

　　纠结了两天，憋出了个蛋，欢迎拍砖！！！

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

　　<head>

　　<title>无标题文档</title>

　　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>

　　jQuery(function(){

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

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

　　if($('.f')){

　　$('ul').append('<div class="f"></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>

　　</ul>

　　</body>

　　</html>