JavaScript Tutorial/jQuery/outerWidth

Материал из Web эксперт
Перейти к: навигация, поиск

Get outer width and outer height

   <source lang="javascript">

<html>

 <head>
   <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
   <script type="text/javascript">

$(document).ready(

 function() {
   alert(
     "outerWidth: "  + $("div").outerWidth() + "\n" + 
     "outerHeight: " + $("div").outerHeight()
   );
 }

);

   </script>
   <style type="text/css">

div {

   width: 200px;
   height: 200px;
   padding: 10px;
   border: 1px solid rgb(200, 200, 200);
   background: lightblue;

}

   </style>
 </head>
 <body>
 </body>

</html></source>


Outer width and height with margin

   <source lang="javascript">

<html>

 <head>
   <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
   <script type="text/javascript">

$(document).ready(

 function() {
   alert(
     "outerWidth: "  + $("div").outerWidth({margin: true}) + "\n" + 
     "outerHeight: " + $("div").outerHeight({margin: true})
   );
 }

);

   </script>
   <style type="text/css">

div {

   width: 200px;
   height: 200px;
   padding: 10px;
   border: 1px solid rgb(200, 200, 200);
   background: lightblue;
   margin: 10px;

}

   </style>
 </head>
 <body>
 </body>

</html></source>