好的函数可以设计为一种工具,变化的地方采用变量[也就是需要开发者自己传进传进来的参数],不变的就是逻辑区,这样在任何地方都可以调用。
document.documentElement.scrollTop||document.body.scrollTop; 这是兼容做法,如果无法从document的元素获取滚动高度,就从body中获取。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
#box{
width: 200px;
height: 200px;
background-color: green;
position: absolute;
}
</style>
<script>
function getPost(ev){
var scrollTop = document.documentElement.scrollTop||document.body.scrollTop; //滚动的高
var scrollLeft = document.documentElement.scrollLeft||document.body.scrollLeft; //滚动时left的值
return {x:ev.clientX+scrollLeft,y:ev.clientY+scrollTop};
}
document.onmousemove=function(ev){
var oEvent = ev||event;
var oDiv = document.getElementById('box');
var post = getPost(oEvent);
oDiv.style.left=post.x+'px';
oDiv.style.top=post.y+'px';
}
</script>
</head>
<body>
<div style="height: 1200px;">
<div id="box"></div>
</div>
</body>
</html>