onlcick=onmousedown+onmouseup;
onprass=onkeydown+onkeyup;
offsetWidth :div的实际宽度,包括border+padding+width;
offsetHeight:
offsetLeft:
offsetTop:
键盘控制div移动,代码如下:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<meta charset="utf-8" />
<style>
div {
width:100px;
height:100px;
background:#F00;
position:absolute;
}
</style>
<script>
document.onkeydown = function (ev) {
var oEvent = ev || event;
var oDiv = document.getElementById("div1");
if (ev.keyCode == 37) {
oDiv.style.left=oDiv.offsetLeft-10+"px"; // offsetLeft 获取div距离左边的实际数值
}
if (ev.keyCode == 39) {
oDiv.style.left = oDiv.offsetLeft + 10 + "px";
}
}
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
遗留问题:
一、 按下键盘不松,开始时会卡顿一下。
转载于:https://www.cnblogs.com/XChWaad/p/4913039.html