js 几种坐标【Javasript】

1、鼠标相对于浏览器  可视文档   区域左上角的位置

    clientX, clientY

2、鼠标相对于文档开头的位置

    先取得滚动位置 

     var top = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;

     var left = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft;

    ie7有 2px 差距，所以

    var top = document.documentElement.scrollTop ? document.documentElement.scrollTop - document.documentElement.clientTop: document.body.scrollTop ;

     var left = document.documentElement.scrollLeft ? document.documentElement.scrollLeft - document.documentElement.clientLeft: document.body.scrollLeft ;

    结果

    event.clientX + left,

    event.clientY + top

    或

    event.pageX

    event.pageY

3、getBoundingClientRect() 来获取页面元素的位置

    相对于文档开头的位置

    this.getBoundingClientRect().left + left   (同上)

    this.getBoundingClientRect().top + top

    相当于jquery中的  offse().left   offse().top