outerWidth() Method - Javascript jQuery Method and Property

Javascript examples for jQuery Method and Property:outerWidth

  1. HOME
  2. Javascript
  3. jQuery Method and Property
  4. outerWidth

Description

The outerWidth() method returns the outer width including padding and border of the FIRST matched element.

Syntax

Parameter Require Data Type Description
includeMargin Optional. A Boolean valuewhether to include the margin

The following code shows how to Return the outer width of a <div> element:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        console.log("Outer width of div: " + $("div").outerWidth());
    });//from  www .  j  a  va2 s.  c o  m
});
</script>
</head>
<body>

<div style="height:100px;width:300px;padding:10px;margin:3px;border:1px solid blue;background-color:red;"></div><br>

<button>Display the outer width of div</button>

</body>
</html>

Related Tutorials