Home/Jquery/.outerWidth() method in Jquery

.outerWidth() method in Jquery

Description:

The jQuery outerWidth () method is used to GET/SET the outer width for the matched element. This will includes left and right padding but not border/margin.

  • GET outer Width: It will return the outerWidth  for the selected/matched element
  • SET outer Width: It will set the outerWidth  for the selected/matched element

Syntax

  • $(selector).outerWidth()
  • $(selector).outerWidth(value,function(Integer index, Number Width))
Margin It specify the Boolean value to include the element’s margin in the calculation.

  • False:It specifies noot to include the margin. It is a default value.
  • True:It specifies to Include the margin.
Value  It specify the number of pixels or a number along with an optional unit.
function(Integer index,width A function returning the outer width to set. Get the index position of the element in the set and the old outer width as parameter


If includeMargin set to false then the padding and border are included in the calculation; if true then the margin is also included.

READ  clone() Method

Example: 

Output: 

Here, width of the box is 90. So width() method will return the same width mentioned the property but innerWidth() method will add the left(10px) , right(10px) padding  and include border as well ( 5+5 = 10). S0 it return 120 as its outerWidth.

dotnet-helpers-jquery-outer-width-thiyagu

Leave A Comment