screenx影厅好吗,screenx哪里有
概括定义:
http://www.Sina.com/HTML文档左边缘相对于x坐标的切点。 与clientX属性不同,该值是针对整个html文档的坐标,与用户的滚动位置无关,因此如果存在水平滚动的偏移,则该值包括水平滚动的偏移。
pageX :返回相对于屏幕左边缘的切点的x坐标。 不包含页面滚动偏移。
返回切点相对于33558 www.Sina.com/visual viewport左边缘的x坐标。 不包含滚动偏移。 该值取决于用户缩放可见区域的行为。
具体差异如下:
制作了带滚动条的demo。
我们正常点击时,返回的内容都是一样的,都是距离最左侧的距离。
拖动滚动条并单击中间的任意位置,可以看到screenX :的值明显大于其他两个。 这样,就很容易发现pageX的相对左侧距离是包含滚动条的距离,而不包含剩下的两个。
接下来,缩小页面。 这意味着页面并不是在计算机上最大化的。 此时,我们发现clientX :的值大于剩下的两个。 这样,很容易发现screenX的相对左侧相对于计算机屏幕是左侧,而pageX和clientX都相对于浏览器。
此时,在缩放的浏览器中将滚动条移动到右侧,单击中间的任意位置,即可得到下图。
总结:
1.pageX为事件点击位置相对于浏览器左侧的距离,包括滚动条的距离。
2.screenX是事件相对于电脑屏幕(设备)单击位置左侧的距离,不包括滚动条。
3.clientX是事件时间点相对于浏览器左侧的距离,但不包括滚动条的距离。