.outerWidth() Method

Syntax

.outerWidth()

Description

The .outerWidth() method returns the width of a particular element with padding, border and margin. The below example shows how to change the style of an element using outerWidth Style property.

Example Code

<style> h4 {width:400;line-height:25px;margin:15px;padding:5px;border:3px solid #666; cursor:pointer;} </style> <script type="text/javascript" src="jquery.js"></script> <link href='http://hscripts.com/style-new.css' rel='stylesheet' type='text/css'> <script type="text/javascript"> $(document).ready(function(){ $("h4").click(function(){ var p=$("h4") $("h4").html("The OuterHeight of the Paragraph is " + p.outerWidth() + ", OuterWidth(True) : " + p.outerWidth(true)); }); }); </script> <br><font color="Red">Jquery outerWidth Style Property.</font> <h4>Click Mouse Once Here</h4><br>