js 得到鼠标的positon 以及相应时间

来源：互联网发布：上海师范大学网络支付编辑：程序博客网时间：2024/04/28 16:22

js 得到鼠标的positon 以及当前点和上一个点的时间间隔。

<!DOCTYPE html><html><head>  <meta charset="utf-8"><!--Created using JS Binhttp://jsbin.comCopyright (c) 2016 by tjcrowder (http://jsbin.com/gejuz/1/edit)Released under the MIT license: http://jsbin.mit-license.org--><meta name="robots" content="noindex">  <title>Example</title>  <style>    body {      height: 3000px;    }    .dot {      width: 2px;      height: 2px;      background-color: black;      position: absolute;    }  </style></head><body><script>arr = [];date_stamp = 0;cha = 0;function at(){document.write(JSON.stringify(arr));}(function() {"use strict";document.onmousemove = handleMouseMove;    function handleMouseMove(event) {var dot, eventDoc, doc, body, pageX, pageY;event = event || window.event; // IE-ism      // If pageX/Y aren't available and clientX/Y// are, calculate pageX/Y - logic taken from jQuery// Calculate pageX/Y if missing and clientX/Y availableif (event.pageX == null && event.clientX != null) {eventDoc = (event.target && event.target.ownerDocument) || document;doc = eventDoc.documentElement;body = eventDoc.body;event.pageX = event.clientX +(doc && doc.scrollLeft || body && body.scrollLeft || 0) -(doc && doc.clientLeft || body && body.clientLeft || 0);event.pageY = event.clientY +(doc && doc.scrollTop  || body && body.scrollTop  || 0) -(doc && doc.clientTop  || body && body.clientTop  || 0 );}var timestamp = new Date().getTime(); if(!date_stamp){date_stamp = timestamp;}cha = timestamp - date_stamp;if( cha > 200) {date_stamp = timestamp;arr.push([event.pageX,event.pageY,cha]);dot = document.createElement('div');dot.className = "dot";dot.style.left = event.pageX + "px";dot.style.top = event.pageY + "px";document.body.appendChild(dot);}    }})();  </script><a id="xx" onclick="at()" href="javascript:void(0)">xxxxxx</a></body></html>

0 0