Posted on 2007-10-16 10:26
semovy 閱讀(333)
評論(0) 編輯 收藏 所屬分類:
CSS式樣
<html>
<head>
<title>test demo</title>
<style type="text/css">
#lightbox {/*該層為高亮顯示層*/
BORDER-RIGHT: #fff 1px solid;
BORDER-TOP: #fff 1px solid;
DISPLAY: none;
Z-INDEX: 9999;
BACKGROUND: #FFFFCC;
LEFT: 50%;
MARGIN: -220px 0px 0px -180px;
BORDER-LEFT: #fff 1px solid;
WIDTH: 280px;
BORDER-BOTTOM: #fff 1px solid;
POSITION: absolute;
TOP: 80%;
HEIGHT: 40px;
TEXT-ALIGN: left
}
#overlay {/*該層為覆蓋層*/
DISPLAY: none;
Z-INDEX: 5000; FILTER: alpha(opacity=70);
LEFT: 0px;
WIDTH: 100%;
POSITION: absolute;
TOP: 0px;
HEIGHT: 100%;
BACKGROUND-COLOR: #fff; moz-opacity:0.8; opacity:.70
}
</style>
<script language="javascript">
function aaa(){
document.all("overlay").style.display="block";
document.all("lightbox").style.display="block";
}
function aaa1(){
document.all("overlay").style.display="none";
document.all("lightbox").style.display="none";
}
</script>
</head>
<body>
<div id="overlay"></div>
<div id="lightbox">
<table border="0">
<tr>
<td valign="middle">
點擊按鈕激活頁面 <input type="button" value="test" name="aaa" onclick="aaa1()">
</td>
</tr>
</table>
</div>
<input type="button" value="test" name="aaa" onclick="aaa()">
<p>
<div style="color:red;font-size:20px;font-weight:bold;background-color:GreenYellow;margin-top:100px;text-align:right;width:500px">一起走過的日子</div>
</p>
</body>
</html>