Jquery method to get the size and coordinates of elements

  • 2020-03-30 02:59:12
  • OfStack

Get coordinates

1. The offset ()

The offset() method returns or sets the offset(position) of the matched element relative to the document. (i.e. viewport coordinates)

The object returned by this method contains two integer properties, top and left, in pixels.

This method is only valid for visible elements.

2. The position ()

The position() method returns the position(offset) of the matched element relative to the parent element. (document coordinates relative to parent element)

The object returned by this method contains two integer properties, top and left, in pixels.

This method is only valid for visible elements.

3. The offsetParent ()

The offsetParent() method returns the closest ancestor location element.

A positioning element is an element whose CSS position attribute is set to relative, absolute, or fixed.

Position can be set through jQuery, or through the position property of CSS.

Two, get the size

Width () and height() methods

The width() method sets or returns the width of the element (not including inner margins, borders, or margins).

The height() method sets or returns the height of the element (not including inner margins, borders, or margins).

Methods innerWidth() and innerHeight()

The innerWidth() method returns the width of the element (including the inner margin).

The innerHeight() method returns the height of the element, including the inner margin.

3. OuterWidth () and outerHeight() methods

The outerWidth() method returns the width of the element (including the inner margin and border).

The outerHeight() method returns the height of the element (including the inner margin and border).

The outerWidth(true) method returns the width of the element (including inner margin, border, and outer margin).

The outerHeight(true) method returns the height of the element (inner margin, border, and outer margin).

Related articles: