自定义对话框

最新推荐文章于 2024-05-30 20:49:44 发布

xiaofan_sap

最新推荐文章于 2024-05-30 20:49:44 发布

阅读量328

点赞数

文章标签： function div button input class border

本文链接：https://blog.csdn.net/xiaofan_sap/article/details/4802123

版权

<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 οnclick="lblClick();"> close</label></div>
</br>
<div>Are you sure to quit?</div></br>
<input id="btnSure" type="button" value="YES" class="input" οnclick="continueEvent();">
<input id="btnCancle" type="button" value="NO" class="input" οnclick="cancleEvent();">
</div>
<input type="button" value="click" οnclick="show();">
</body>

</html>