<html>
<head>
<style>
body{
font-size:12px;
}
</style>
<script type="text/javascript" language="javascript">
function divShow(tip){
//基礎定義
var bgWidth,bgHeight;
var msgWidth=300;
var msgHeight=100;
var titleHeight=20;
bgWidth=document.body.offsetWidth;
bgHeight=document.body.offsetHeight;
var titleBgColor="#99CCFF";
var bgDiv=document.createElement("div");
bgDiv.setAttribute("id","bgDiv");
bgDiv.style.position="absolute";
bgDiv.style.top="0";
bgDiv.style.left="0";
bgDiv.style.background="#777";
bgDiv.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
bgDiv.style.opacity="0.6";
bgDiv.style.width=bgWidth+"px";
bgDiv.style.height=bgHeight+"px";
bgDiv.style.zIndex="100";
document.body.appendChild(bgDiv);
var msgDiv=document.createElement("div");
msgDiv.setAttribute("id","msgDiv");
msgDiv.setAttribute("align","center");
msgDiv.style.background="white";
msgDiv.style.position="absolute";
msgDiv.style.left="35%";
msgDiv.style.top="40%";
msgDiv.style.width=msgWidth+"px";
msgDiv.style.height=msgHeight+"px";
msgDiv.style.textAlign="center";
msgDiv.style.zIndex="101";
var title=document.createElement("div");
title.setAttribute("id","title");
title.setAttribute("align","right");
title.style.background=titleBgColor;
title.style.filter="progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";
title.style.opacity="0.75";
title.style.height=titleHeight;
title.innerHTML="<span id='closeButton' style='cursor:pointer'>關閉</span>";
document.body.appendChild(msgDiv);
document.getElementById("msgDiv").appendChild(title);
var txt=document.createElement("p");
txt.style.margin="1em 0"
txt.setAttribute("id","msgTxt");
txt.innerHTML=tip;
document.getElementById("msgDiv").appendChild(txt);
var closeAll= document.getElementById("closeButton");
closeAll.onclick=function(){
document.body.removeChild(bgDiv);
document.getElementById("msgDiv").removeChild(title);
document.body.removeChild(msgDiv);
}
}
</script>
</head>
<body>
<div id="bgContent">
<input type="button" value="彈出" onclick="divShow('顯示我吧');"/>
</div>
</body>
</html>