The difference between ScreenX ClientX Pagex

ScreenX ClientX Pagex Concept

ScreenX: The mouse position relative to the user screen horizontal offset, and screeny is perpendicular, the reference point at this point is the origin of the screen is the upper left corner.

ClientX: Compared to Screenx, the reference point is changed to the upper-left corner of the browser content area, and the reference point moves with the scroll bar.

PageX: The reference point is also the upper-left corner of the browser content area, but it does not change with the scroll bar

(red dot is the current position of the mouse)

Reference Code

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
 ScreenX ClientX Pagex differences