Home > Web Front-end > JS Tutorial > body text

jquery gets the coordinate value of the page element implementation ideas and code_jquery

WBOY
Release: 2016-05-16 17:37:01
Original
902 people have browsed it

How does jquery get the coordinate value of a page element? yulutxt is an input box for inputting classic quotations. For the feedBackMessage function, see http://www.wesoho.com/article/asp/2765.htm

Copy code The code is as follows:

var p = $("#yulutxt");
var yuluoffset = p.offset();
feedBackMessage(msg,yuluoffset.left p.width() 10,yuluoffset.top,5000);

------------------
1. Obtain the object (custom adjustment to open a new window reference element)
var obj = $("#oButton");
In the example, the object I obtained is the pop-up window button, and the new window created in this way This will be adjusted based on the button's position, in the example the new window will be created showing the lower right corner of the button.

2, get the position of the object element (offset() method)
var offset = obj.offset();
Get the position of the object element, which are the top and left of the element, call the method Yes: offset.left and offset.top, you can know the left and top positions of the current object.

3, get the width of the object element (width() method)
var right = offset.left obj.width();
In the example, get the lower right corner position of the object and create a new window the left position.

4, get the height of the object element (height() method)
var down = offset.top obj.height();
In the example, get the lower right corner position of the object and create a new window top position
Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template