在B/S的項目中,越來越的功能的需要添加到頁面上,但一個頁面承載這麼多功能,就會讓頁面的美觀度、甚至體驗友好度大打折扣.但如果將某些不是很必須的元素先隱藏起來，當用戶點擊後再將此元素以相應的形式出現，這樣的設計可減少網頁頁面的體積，以讓網頁設計者很好的開展自己的想象，設計出更加人性化的用戶UI界面。
如下圖所示：
提示框：
警告框：
以上網頁對話框,相信大家都不陌生,最常見的就是彈出登陸/註冊框，像百度：
還有一些,例如修改錄入等:
對話網頁,其實也就是我們常說的彈出框,彈出頁面也是能自定義的.看到這兒相信你已經發現,對話框的設計還有很大的潛力去發掘.下面介紹一下,實現方法.
主要用到javascript中window對象的用window.showModalDialog函數打開一個IE的模式窗口,然後利用window.returnValue 屬性,作爲返回值返回.
主頁：
<span style="font-family:Microsoft YaHei;font-size:14px;"><pre name="code" class="html"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Main web</title>
<script language="javascript">
function showmodal(){
var data = window.showModalDialog("child.html",null,"dialogWidth:350px;dialogHeight:350px;help:no;status:no");
alert(data);
}
</script>
</head>
<body>
<input id=button1 type=button value=Button name=button1 οnclick="showmodal();">
</body>
</html>
</span>
子頁：
<span style="font-family:Microsoft YaHei;font-size:14px;"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Dialog web</title>
<script language="javascript">
function trans(){
window.returnValue="data";
window.close();
}
</script>
</head>
<body>
<input id=button1 type=button value="返回數據" name=button1 οnclick="trans();">
</body>
</html>
</span>這個returnValue除了可以是布爾值,整型值等以外還可以是個js數組，用來傳遞大量數據。在.net 平臺中，js數組是常用的傳送對象，通過序列化，就可以讓兩個頁面之間方便的傳送數據了。