JavaScript Tutorial/jQuery/outerWidth

Материал из Web эксперт
Версия от 18:52, 25 мая 2010; (обсуждение)
(разн.) ← Предыдущая | Текущая версия (разн.) | Следующая → (разн.)
Перейти к: навигация, поиск

Get outer width and outer height

<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>
    <div></div>
  </body>
</html>


Outer width and height with margin

<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>
    <div></div>
  </body>
</html>