First, talk about the size of the elements, this use a lot.
1. Width (). Height () Gets the width of the element, and does not contain units, equivalent to the native offsetwidth, but note 2 points
The native result contains the unit, and is not able to get to the wide height of the hidden element.
2. Innerwidth (). Innerheight ()//equivalent to Width+padding
3. Outerwidth (). Outerheight ()//equivalent to width + padding + border
4. Outerwidth (True). Outerheight (TRUE)//equivalent to width + padding + border + margin
The above several usages use quite a lot of, also used before, but note that these methods can not only be used to obtain, but also can be used to set up, for example,. Outerwidth (200,true);
The width of the viewable area, $ (window). Height ();
The height of the page, $ (document). Height ();
Page scrolling distance, $ (document). ScrollTop (); available here or set.
Second, distance location
$ (). Offset (). Left//element to the entire page distance, notice here left and top without parentheses (often make mistakes!) )
$ (). Position (). Left//element to the location of the ancestor node distance, if not found, it is the distance to the page (note this is the margin value)
JQ size and Position summary (width scrolltop position offset)