.width() .width( value ) .width( function(index, width) )
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <style> body { background:yellow; } button { font-size:12px; margin:2px; } p { width:150px; border:1px red solid; } div { color:red; font-weight:bold; } </style> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(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> </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>
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <style> div { width:70px; height:50px; float:left; margin:5px; background:red; cursor:pointer; } </style> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("div").one('click', function () { $(this).width(30) .css({cursor:"auto", "background-color":"blue"}); }); }); </script> </head> <body> <div></div> <div>d</div> <div>d</div> <div>d</div> <div>d</div> </body> </html>
ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท
ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน 
Load balance : Server 04
