前端开发者php和前端移动开发 前端移动端开发规范 web前端开发移动端
代码：
<!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 : <span id=”movementX”></span> px<br>
Movement – Y : <span id=”movementY”></span> px<br>
Movement : <span id=”movement”></span> px<br>
Speed : <span id=”speed”></span> px/s<br>
Max. Speed : <span id=”maxSpeed”></span> px/s<br>
Acceleration : <span id=”acceleration”></span> px/s<sup>2</sup><br>
Max. Positive Acceleration : <span id=”maxPositiveAcceleration”></span> px/s<sup>2</sup><br>
Max. Negative Acceleration : <span id=”maxNegativeAcceleration”></span> px/s<sup>2</sup><br>
<script>
var prevEvent, currentEvent;
document.documentElement.onmousemove = function (event) {
currentEvent = event;
}
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>
移动前端开发模板 前端和移动开发 武汉前端移动开发培训
970106_lzh 2年前 (2021-01-08)说：
huihui 3年前 (2020-10-20)说：
Satisfy 3年前 (2020-06-05)说：
评论前必须登录！
注册