How to find the element's x center coordinates and related window offset

javascript jquery coordinates center offset
itsme picture itsme · Nov 6, 2011 · Viewed 57k times · Source

i would like to retrieve the element offset starting from his own x center coordinates.

how can i do it?

Actually i can find the window offset of an element but it retrieves the coordinates from the border of the element like this:

var _position = $(this).offset();

Answer

Rob W picture Rob W · Nov 6, 2011

You have to use offset() to get the top and left position, then add half of the height() and width() values to them. That gives the center coordinates.

var $this = $(this);
var offset = $this.offset();
var width = $this.width();
var height = $this.height();

var centerX = offset.left + width / 2;
var centerY = offset.top + height / 2;

If you need to consider the padding property in your calculations, use the following:

var width = $this.outerWidth();
var height = $this.outerHeight();

Related questions

Select a portion of an image and retrieve its coordinates with jQuery

I need a way for user to select the portion of an image either by resizing transparent rectangle or by clicking and dragging the selection area (as it's done in desktop OS), both would work for me. Then i need …

Read More
How to get cells (<td>) x and y coordinate in table using jQuery?

I'm looking for a good way to get cells X-Y position in a table. (do not confuse it with css-position, I am looking for X and Y coordinate in Cartesian coordinate system). As we know, we can get particular cell …

Read More
How to return X and Y coordinates when using jquery.hammer.js

I am programming a little page using jquery.hammer.js and I have having problems getting the x and y coordinates of a touch event. my code is as follows: var x1, y1; var element = document.getElementById("myDIV") $(element).hammer().…

Read More