jQuery Tutorial

jQuery offset() Method With Syntax and Example

Understanding offset method in jQuery

The offset() method sets or returns the document offset coordinates for the selected elements.

When the offset is returned:

In this method, It returns the offset coordinates. In addition, it gives you an object with two properties: the top and left pixel positions.

When used to set the balance, this function sets the offset coordinates of ALL matching elements.

Syntax of offset method in jQuery

  • Return the offset coordinates:

$(selector).offset()

  • Set the offset coordinates:

$(selector).offset({top:value,left:value})

  • Set offset coordinates using a function:

$(selector).offset(function(index,currentoffset))

Example of jQuery offset method

The offset coordinates of a p> element are returned:

$("button").click(function(){
  var x = $("p").offset();
  alert("Top: " + x.top + " Left: " + x.left);
});
Did you find this article helpful?