文章 - 获得鼠标速度和加速度

获得鼠标速度和加速度

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>获得鼠标速度和加速度</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">
<style>
body{
 background-color:#000;
 color:gold;
 font-family:sans-serif;
}

span{
 color:yellow;
}
</style>
</head>
<body>
 Movement - X : px 
Movement - Y : px 
Movement : px 
Speed : px/s 
Max. Speed : px/s 
Acceleration : px/s2 
Max. Positive Acceleration : px/s2 
Max. Negative Acceleration : px/s2

var maxSpeed=0,prevSpeed=0,maxPositiveAcc=0,maxNegativeAcc=0;
setInterval(function(){
  if(prevEvent && currentEvent){
    var movementX=Math.abs(currentEvent.screenX-prevEvent.screenX);
    var movementY=Math.abs(currentEvent.screenY-prevEvent.screenY);
    var movement=Math.sqrt(movementX*movementX+movementY*movementY);

document.getElementById("movementX").innerText=movementX;
    document.getElementById("movementY").innerText=movementY;
    document.getElementById("movement").innerText=Math.round(movement);

//speed=movement/100ms= movement/0.1s= 10*movement/s
    var speed=10*movement;//current speed

document.getElementById("speed").innerText=Math.round(speed);
    document.getElementById("maxSpeed").innerText=Math.round(
      speed>maxSpeed?(maxSpeed=speed):maxSpeed
    );

var acceleration=10*(speed-prevSpeed);

document.getElementById("acceleration").innerText=Math.round(
      acceleration
    );

if(acceleration>0){
 document.getElementById("maxPositiveAcceleration").innerText=Math.round(
 acceleration>maxPositiveAcc?(maxPositiveAcc=acceleration):maxPositiveAcc
 );
 }
 else{
 document.getElementById("maxNegativeAcceleration").innerText=Math.round(
 acceleration<maxNegativeAcc?(maxNegativeAcc=acceleration):maxNegativeAcc
 );
 }
 }

prevEvent=currentEvent;
 prevSpeed=speed;
},100);
</script>
</body>
</html>

获得鼠标速度和加速度

评论 ( 0 )

最新评论

暂无评论

获得鼠标速度和加速度

评论 ( 0 )

最新评论

暂无评论

欢迎您回来

创建账号

找回密码