[转]创建一个JavaScript弹出DIV窗口层的效果

本文转自：http://www.soso.io/article/23698.html

<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <style>

#popupcontent{

position: absolute;

visibility: hidden;

overflow: hidden;

border:1px solid #CCC;

background-color:#F9F9F9;

border:1px solid #333;

padding:5px;

}

    </style>

    <script>

var baseText = null; 

function showPopup(w,h){

var popUp = document.getElementById("popupcontent");

popUp.style.top = "150px";

popUp.style.left = "150px";

popUp.style.width = w + "px";

popUp.style.height = h + "px";

//if (baseText == null) baseText = popUp.innerHTML;

//popUp.innerHTML = baseText + "<div id=\"statusbar\"><button onclick=\"hidePopup();\">Close window</button></div>";

//var sbar = document.getElementById("statusbar");

//sbar.style.marginTop = (parseInt(h)-40) + "px";

popUp.style.visibility = "visible";

} 

function hidePopup(){

var popUp = document.getElementById("popupcontent");

popUp.style.visibility = "hidden";

} 

    </script>

</head>

<body>

    <a href="#" onclick="showPopup(600,600);" >Open popup</a>

    <div id="popupcontent">这是一个DIV弹窗效果!相关内容如下

    <iframe src="Agree.html" width="500px" height="500px;" scroll="auto"></iframe>

    <div id="statusbar"><button onclick="hidePopup();">Close window</button></div>

    </div>

</body>

</html>

巴特西

[转]创建一个JavaScript弹出DIV窗口层的效果

最新文章

热门文章