div跟随鼠标移动的函数：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
#div1 {
200px;
height: 200px;
background: red;
position: absolute;
}
</style>
<script>
function getPos(ev) {
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
return {x: ev.clientX + scrollLeft, y: ev.clientY + scrollTop};
}
document.onmousemove = function (ev) {
var oEvent = ev || event;
var oDiv = document.getElementById('div1');
var pos = getPos(oEvent);
oDiv.style.left = pos.x + 'px';
oDiv.style.top = pos.y + 'px';
};
</script>
</head>
<body style="height:2000px;">
<div id="div1"></div>
</body>
</html>
HTML：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
div {
50px;
height: 50px;
background: red;
position: absolute;
}
</style>
<script>
function getPos(ev) {
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
return {x: ev.clientX + scrollLeft, y: ev.clientY + scrollTop};
}
document.onmousemove = function (ev) {
var aDiv = document.getElementsByTagName('div');
var oEvent = ev || event;
var pos = getPos(oEvent);
for (var i = aDiv.length - 1; i > 0; i--) {
aDiv[i].style.left = aDiv[i - 1].offsetLeft + 'px';
aDiv[i].style.top = aDiv[i - 1].offsetTop + 'px';
}
aDiv[0].style.left = pos.x + 'px';
aDiv[0].style.top = pos.y + 'px';
};
</script>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</body>
</html>
运行结果（每一个div都跟着前面一个div，第一个div跟着鼠标）：
HTML（div跟随键盘移动）：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
#div {
100px;
height: 100px;
background: #ff44c0;
position: absolute;
}
</style>
<script>
document.onkeydown = function keyDown(ev)//按下键盘事件
{
var oEvent = ev || event;
var oDiv = document.getElementById("div");
var speed = 20;
if (oEvent.keyCode == 37) {//键盘左键
oDiv.style.left = oDiv.offsetLeft - speed + "px";
} else if (oEvent.keyCode == 38) {//键盘右键
oDiv.style.top = oDiv.offsetTop - speed + "px";
} else if (oEvent.keyCode == 39) {//键盘上键
oDiv.style.left = oDiv.offsetLeft + speed + "px";
} else if (oEvent.keyCode == 40) {//键盘下键
oDiv.style.top = oDiv.offsetTop + speed + "px";
}
};
</script>
</head>
<body>
<div id="div"></div>
</body>
</html>
运行结果：
