一、幾個關鍵點
1：當文檔大小改變時可以通過哪個事件來觸發？
resize([Data], fn) 可傳入data供函數fn處理。
示例：
- $(window).resize(function(){
- alert("Stop it!");
- });
2：怎樣獲得浏覽器窗口的寬度高度？
獲取當前浏覽器窗口的寬度
- $(window).width();
獲取第一段的寬
- $("p").width()
獲取當前HTML文檔寬度
$(document).width();
3：怎樣賦值？
方法很多，可以通過css（...）、width(...)等
二、舉個例子
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <title>jquery自適應www.linuxidc.com</title>
- </head>
- <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
- <script>
- $(document).ready(function(){
- //初始化寬度、高度
- $("#div1").width($(window).width());
- $("#div1").height($(window).height());
- //當文檔窗口發生改變時 觸發
- $(window).resize(function(){
- $("#div1").width($(window).width());
- $("#div1").height($(window).height());
- })
- })
- </script>
- <body style="margin:0;">
- <div id="div1" style="background:#09F">
- 這是一個可以自適應窗口的DIV
- </div>
- </body>
- </html>
