jQuery Tutorial Tutorials - jQuery .outerHeight() method

jQuery .outerHeight() method

The .outerHeight() method in jQuery is used to get/set the outer height (including padding,border and optionally margin) of the matched element.

jQuery .outerHeight() method Syntax

.outerHeight([includeMargin])
.outerHeight(value)
.outerHeight(function)
Parameter Type Description
inlcudeMargin Boolean whether to include the element's margin when computing, default false
value String,Number the height value to set
funtion(index, oldHeight) Function a function returning the outer height to set.
index is the position of the element in the set.(based on 0)
oldHeight is the old outer height.

.outerHeight()

Get the current computed outer height(including padding,border and optionally margin) of the first matched element.(If the element is not visible, the height would be 0 )

example

Get the outer height of the first paragraph

$("p").outerHeight();
$("p").outerHeight(true); // including margin

Try now

.outerHeight(value)

Set the outer height(including padding,border) of every matched elements.

example

Set the outerHeight of each p to 30px

$("p").outerHeight(30);

Try now

.outerHeight(function)

example

Set the outerHeight of the element to 10px higher than the previous.

$("p").outerHeight(function(index,oldValue){
    return 10*index + oldValue;
});

Try now

Date：2019-08-20 15:49:08 From:www.Lautturi.com author：Lautturi
.innerWidth() method
.outerWidth() method