當前位置：軟件學堂 > 資訊首頁 > 網(wǎng)絡(luò)編程 > 編程其他 > JS實現(xiàn)頁面隨窗口的改變而改變

JS實現(xiàn)頁面隨窗口的改變而改變

2012/11/3 16:05:23作者：佚名來源：網(wǎng)絡(luò)

移動端

【實例名稱】

JS實現(xiàn)頁面隨窗口的改變而改變

【實例描述】

當窗口改變時，頁面隨著窗口的改變而改變，這是頁面設(shè)計的關(guān)鍵。本例學習如何實現(xiàn)這種設(shè)計。

【實例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>標題頁-學無憂（m.wangbatian.cn）</title>
<style>body{margin:0px;}table{border-collapse:collapse;}</style>
</head>
<body>
<table width="100%" height="100%" border="3" bgcolor="gray" bordercolor="red">
      <tr>
           <td>測試頁面的改變1</td><td>測試頁面的改變2</td>
      </tr>
</table></body>
</html>
 

【運行效果】

 頁面隨窗口的改變而改變運行效果

【難點剖析】

本例的重點是表格的寬度和高度的設(shè)置。將寬度和高度設(shè)置為百分比的形式，表示表格占當前窗口的比例。如果設(shè)置高度為80%，則不管窗口如何改變，表格的高度永遠占窗口的80%，這樣就實現(xiàn)了表格隨窗口改變而改變的功能。

【源碼下載】

為了JS代碼的準確性，請點擊：頁面隨窗口的改變而改變 進行本實例源碼下載 

標簽： JS  窗口  改變