clientX,offsetX,screenX,pageX

event.clientX event.clientY

client直译就是客户端,客户端的窗口就是指游览器的显示页面内容的窗口大小,不包含工具栏、导航栏等等
event.clientX、event.clientY就是用来获取鼠标距游览器显示窗口的长度

event.offsetX event.offsetY

offset意为偏移量,是被点击的元素距左上角为参考原点的长度,而IE、FF和Chrome的参考点有所差异。
Chrome下,offsetX offsetY是包含边框的(以盒子左上角为坐标原点,包含边框 padding值与元素)
而IE、FF是不包含边框的,如果鼠标进入到border区域,为返回负值(只包含padding值与元素)

event.screenX event.sreenY

screen顾名思义是屏幕,是用来获取鼠标点击位置到屏幕显示器的距离,距离的最大值需根据屏幕分辨率的尺寸来计算。

event.pageX event.pageY

page为页面的意思,页面的高度一般情况client游览器显示区域装不下,所以会出现垂直滚动条。
鼠标距离页面初始page原点的长度。在IE中没有pageX、pageY取而代之的是event.x、evnet.y

jqurey中的offset()

$.offset().left 指的是选中元素左边相对于浏览器窗口的坐标(不包含导航条、工具栏)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容