Home  >  Article  >  Web Front-end  >  Usage examples of position() method in jQuery_jquery

Usage examples of position() method in jQuery_jquery

WBOY
WBOYOriginal
2016-05-16 16:19:581046browse

The example in this article describes the usage of the position() method in jQuery. Share it with everyone for your reference. The specific analysis is as follows:

This method gets the offset of the matched element relative to some element.
The returned object contains an object with two integer properties (top and left).
This method only works on visible elements.
Grammar structure:

Copy code The code is as follows:
$(selector).position()

At the beginning of the tutorial, the reason why it is said is to get the offset of the matching element relative to some elements. Many tutorials say that the offset returned by the method is relative to the parent element, but this is not entirely true. This method will process the matching element with absolute positioning. Of course, it does not mean that the matching element is actually set to absolute positioning. The offset reference principle of the method is as follows:

1. If the parent element does not use positioning (the position attribute value is relative, absolute or fixed), then the offset reference object is the window.
2. If any of the parent elements are positioned, then the reference object of the offset is the nearest positioned element.

Example code:

Copy code The code is as follows:






position() function-Script Home













In the top combination in the above code, since the parent element uses relative positioning, the obtained offset is relative to the parent element. In the bottom combination, since the parent element does not use positioning, the offset reference object is the window.

I hope this article will be helpful to everyone’s jQuery programming.

This article is reproduced from: Ant Tribe http://www.softwhy.com/

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn