实现页面方块跟随鼠标移动而移动

在页面上实现一个方块跟随鼠标的位置移动而移动

实现原理：捕捉鼠标的事件，获取鼠标的当当前的位置，然后把这个位置坐标传给方块即可。

<style type="text/css">
.div1{
    position:absolution;
    width:200px;
    height:200px;
    background-color:red;
}
</style>
<div id="div1" class="div1"></div>

<script type="text/javascript">
document.onmouseover = function(ev){
    var div1 = document.getElementById('div1');
    var oEvent = ev || window.event;
    var scrollTop = document.documentElement.scrollTop || document.body.scrollTop || window.pageYOffset;
    var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft || window.pageXOffset;
    div1.style.left = oEvent.clientX + scrollLeft + 'px';
    div1.style.top = oEvent.clientY + scrollTop + 'px';
};
</script>

这里使用了两个兼容性处理，一个是鼠标事件，另一个是距离上面的滚动距离。