9.20.2012

clientX/Y vs pageX/Y in jQuery

Difference between jQuery mouse event clientX/Y & pageX/Y

S.No
ClientX/Y
PageX/Y
1
What is the function of this event ?
It gives us x,y offset of the mouse click point relative to top left browser's view port regardless of the scrolling. For example, our browser window view port size 1024x820 px, the maximum value of clientX/clientY would be 1024 px/820 px irrespective of the document size.
What is the function of this event ?
It gives us x,y offset of the mouse click point relative to top left of the document regardless of the scrolling.


Example:

$(document).click(function(e){
alert(e.clientX);
alert(e.clientY);
alert(e.pageX);
alert(e.pageY);
});

Reference:


No comments:

Post a Comment