鼠标移动事件

来源:互联网 发布:mac os x 10.6 iso 编辑:程序博客网 时间:2024/06/09 20:36

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>鼠标移动事件</title>    <style type="text/css">        *{margin:0px;padding:0px;}        #move{width:100px;height:100px;background:orange;font-family:microsoft yahei;position:absolute;}    </style></head><body>    <div id="move">当期鼠标位置<br>X:100<br>Y:200</div>    <script type="text/javascript">    //获取元素    var m = document.getElementById('move');     //绑定事件    window.onmousemove = function(e){        //获取当前鼠标的位置        var x = e.clientX;        var y = e.clientY;         //修改div的left和top        m.style.left = x+'px';        m.style.top = y+'px';         //拼接字符串        var str = "当期鼠标位置<br>X:"+x+"<br>Y:"+y;         //修改标签文本        m.innerHTML = str;     }     </script></body></html>


0 0
原创粉丝点击