但是你懂的，浏览器实在太不和谐了，兼容性且不说，各种坐标属性看得人头昏眼花，极容易混淆。好吧，我来总结一下：
测试浏览器：ie8, chrome13, ff8, safari5, opera11
先上测试用例（用html5的doctype测试，也可看出未来的发展趋势，其他doctype可自行测试）：
复制代码 代码如下:
空白区
点击
问：怎样获取鼠标相对于浏览器可视文档区域左上角的位置？
答：x, y和clientx, clienty皆可，但是x, y在ie下表示鼠标相对于文档开头的位置（即如果有滚到条的话，会计算在内），还有ff也不支持x, y
推荐： clientx, clienty
问：怎样获取鼠标相对于文档开头的位置？
答： ie：使用x, y（前提是事件源的父元素（一直到documentelement）没有设置position:relative之类的，否则相对于最近元素，而非相对于文档）
非ie：使用pagex, pagey
layerx, layery其实也可以，但是ie和opera不支持！
那么如何确保ie正常取值呢？答：event.clientx + document.documentelement.scrollleft,event.clienty + document.documentelement.scrolltop
问：怎样获取鼠标相对于事件源(event.target||event.srcelement)左上角的位置？
答：offsetx, offsety。但是ff不支持，怎样办呢？
1. 先获取鼠标相对于浏览器可视文档区域左上角的位置
2. 然后获取事件源相对于浏览器可视文档区域左上角的位置
3. 相减，收工
也许有人会问，这第2步怎么做啊？好吧，好人做到底！
htmlelement.getboundingclientrect()方法
返回值为：{top:xx, right:xx, bottom:xx, left:xx, width:xx, height:xx}
也就是说，一个元素的位置信息都给了，我们要做的就是:
复制代码 代码如下:
var box = (e.target || e.srcelement).getboundingclientrect(),
offsetx = e.clientx - box.left,
offsety = e.clienty - box.top;
经测试，所有浏览器都和event.offsetx, event.offsety保持一致（当然ff除外）
我的例子中，最后还检测了scrollleft, scrolltop, clientleft, clienttop，本来以为它们几个会作怪，可测试结果表明：
除了scrolltop，其他都是0（当然scrollleft是因为没出现横向滚动条所致）
scrolltop各浏览器表现不尽相同，如下：
body.scrolltop的情况
ie, ff, opera：0
chrome, safari：向上滚动的距离
documentelement.scrolltop的情况
ie, ff, opera：向上滚动的距离
chrome, safari：0