js 判断鼠标 范围

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <SCRIPT LANGUAGE="JavaScript"> <!-- function checkIn(e){ var x=window.event.clientX; var y=window.event.clientY; var str=''; for(i=0;i<document.body.children.length;i++) { var obj=document.body.children[i]; if(x>obj.offsetLeft&&x<(obj.offsetLeft+obj.clientWidth)&&y>obj.offsetTop&&y<(obj.offsetTop+obj.clientHeight)) { str+='<鼠标位于层'+obj.id+'范围之内>/n'; }else{ str+='<鼠标位于层'+obj.id+'范围之外>/n'; } } alert(str); } document.onclick=checkIn //--> </SCRIPT> </HEAD> <BODY id=body> <div id="Layer1" style="position:absolute; left:260px; top:117px; width:500px; height:500px; z-index:1; background-color:red; layer-background-color:red; border:1px none #000000;"> </div> <div id="Layer2" style="position:absolute; left:500px; top:150px; width:300px; height:300px; z-index:1; background-color:green; layer-background-color:green; border:1px none #000000"></div> <div id="Layer3" style="position:absolute; left:100px; top:10px; width:200px; height:200px; z-index:1;background-color:yellow;border:1px none #000000"></div> <table id=table1 width="100%" border="1" cellspacing="0" cellpadding="0"> <tr> <td> </td> <td> </td> <td> </td> </tr> </table> </BODY> </HTML>

你可能感兴趣的:(JavaScript,html,div,border,generator,layer)