鼠标移动事件

游鹄君2025年4月30日小于 1 分钟

示例代码

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>鼠标移动事件</title>
  <style type="text/css">
    *
    {
     margin:0px;
     padding:0px;
    }
    #dd
    {
     width:800px;
     height:500px;
     border:solid 1px blue;
    }
    #vv
    {
     width:800px;
     height:100px;
     border:solid 1px red;
    }
 
  </style>
</head>
<body>
  <div id='dd'></div>
  <div id='vv'></div>
  <script type="text/javascript">
    //获取元素对象
    var dd=document.getElementById('dd');
    var vv=document.getElementById('vv');
 
    dd.onmousemove=function(e)
    {
      var x=e.clientX;
      var y=e.clientY;
 
     vv.innerHTML='坐标的x是'+x+' '+'y坐标是'+y;
 
    }
 
    
  </script>
</body>
</html>