Next »
85/185
« Previous

.innerWidth()

In this chapter you will learn:

  1. Syntax and Description for .innerWidth()
  2. How to get inner width for a div element

Syntax and Description

.innerWidth() gets the current computed width for the first element in the set of matched elements, including padding but not border.

Its Return value is the width of the element, including left and right padding, in pixels.

This method is not applicable to window and document objects, for these use .width() instead.

Get the inner width

The following sets the width for a div element first and gets its inner width afterwards.

<html><!--  j  av a2  s. c om-->
  <head>
    <script src="http://java2s.com/style/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
             $("div").width(300);
             alert($("div").innerWidth());
        });
    </script>
    <style>
    div{
        width:200px;
        height:100px;
        overflow:auto;
    }
    h1 { width:1000px;height:1000px; }
  </style>

  </head>
  <body>
    <body>
       <div><h1>java2s.com</h1></div>
    </body>
</html>

Click to view the demo

Next chapter...

What you will learn in the next chapter:

  1. Syntax and Description for .insertAfter()
  2. Insert after paragraph
  3. How to insert a clone element
  4. Insert a selected element
  5. Insert a hard coded element
  6. .after vs .insertAfter
Next »
« Previous