jQuery日本語リファレンス

jQuery does not mean Japanese Query...

Css/API/jQuery - Sample Code

width()


            
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="/jquery/js/jquery.js"></script>
  
  <script>
  $(document).ready(function(){
    
    function showWidth(ele, w) {
      $("div").text("The width for the " + ele + 
                    " is " + w + "px.");
    }
    $("#getp").click(function () { 
      showWidth("paragraph", $("p").width()); 
    });
    $("#getd").click(function () { 
      showWidth("document", $(document).width()); 
    });
    $("#getw").click(function () { 
      showWidth("window", $(window).width()); 
    });

  });
  </script>
  <style>
  body { background:yellow; }
  button { font-size:12px; margin:2px; }
  p { width:150px; border:1px red solid; }
  div { color:red; font-weight:bold;  }
  </style>
</head>
<body>
  <button id="getp">Get Paragraph Width</button>

  <button id="getd">Get Document Width</button>
  <button id="getw">Get Window Width</button>
  <div> </div>
  <p>
    Sample paragraph to test width
  </p>
</body>
</html>
            
          
[実行結果]
[width() の説明へ]