自定义对话框

来源：互联网发布：云浮市房地产数据编辑：程序博客网时间：2024/04/29 19:18

<html>

<head>

<title></title>
<style type="text/css">
.div
{
    text-align=center;
    display=none;
    position=absolute;
    width=250px;
    height=50px;
    z-index:1000;
    border:3px solid #000;
}
.input
{
    width=40px;
}
</style>
<script type="text/javascript">
function $(s)
{
    return typeof s=="string"?document.getElementById(s):s;
}
function scrollX()
{
var de=document.documentElement;
return self.pageXOffset||(de&&de.scrollLeft)||document.body.scrollLeft;
}
function scrollY()
{
    var de=document.documentElement;
    return self.pageYOffset||(de&&de.scrollTop)||document.body.scrollTop;
}
function windowHeight()
{
    var de=document.documentElement;
    return self.innerHeight||(de&&de.clientHeight)||document.body.clientHeight;
}
function windowWidth()
{
    var de=document.documentElement;
    return self.innerWidth||(de&&de.clientWidth)||document.body.clientWidth;
}
function show()
{
    var div=$("div");
    div.style.display="block";
    div.style.top=scrollY()+(windowHeight()/2-25)+"px";
    div.style.left=scrollX()+(windowWidth()/2-120)+"px";
    div.style.background ="#eee";
    alert(div.style.top);
}
function continueEvent()
{
    $("div").style.display="none";
    alert("ok");
}

function cancleEvent()
{
    $("div").style.display="none";
    return false;
}
function lblClick()
{
    $("div").style.display="none";
}
</script>

</head>

<body>
<div id="div" class="div">
<div style="text-align:right;float:right;background:#00d; height:5px;width:100%"><label onclick="lblClick();"> close</label></div>
</br>
<div>Are you sure to quit?</div></br>
<input id="btnSure" type="button" value="YES" class="input" onclick="continueEvent();">
<input id="btnCancle" type="button" value="NO" class="input" onclick="cancleEvent();">
</div>
<input type="button" value="click" onclick="show();">
</body>

</html>