鼠标位置

<!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>mousexy</title>
<style type="text/css">
  .t{
     width:100px;
     height:100px;
     background-color:blue
  }
  .u{
	/* position:absolute;*/
	 
     width:100px;
     height:100px;
     background-color:red;
	 float:none;
  }
</style>
<script>
   function mousePosition(ev){
   // ev = ev ? ev : (window.event ? window.event : null);
    if(ev.pageX || ev.pageY){
	  document.getElementById('tt').value='x:'+ev.pageX+',y:'+ev.pageY;
      return {x:ev.pageX, y:ev.pageY};
    }
	document.getElementById('tt').value='x:'+(ev.clientX + document.body.scrollLeft - document.body.clientLeft)+',y:'+(ev.clientY + document.body.scrollTop-document.body.clientTop);
    return {x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,y:ev.clientY + document.body.scrollTop - document.body.clientTop};
   }
  

</script>

</head>

<body onmousemove="mousePosition(event)">
<table>
<tr>
	<td><div class="t"></div></td>
	<td><div class="t"></div></td>
	<td><div class="t"></div></td>
</tr>
<tr>
	<td><div class="t"></div></td>
	<td><div class="t"></div></td>
	<td></td>
	
</tr>
<tr>
	<td><div class="u"></div></td>
	<td></td>
	<td></td>
	
</tr>
</table>

<td><input type="text" id="tt"  /></td>
</body>
</html>


兼容firefox鼠标的位置

IE下

鼠标位置_第1张图片

FF下

鼠标位置_第2张图片

你可能感兴趣的:(html,function,XHTML,Class,firefox,float)