JS彈出層

JS部分

<script src="jquery.min.js" language="javascript"></script>

<script>

function showDiv(){
    $("#BgDiv").css({ display:"block",height:$(document).height()});
    $("#showdiv").html('<div><a href="javascript:hideDiv();">關閉</a></div>');
    $("#showdiv").css("display","block");
}

function hideDiv(){
    $("#BgDiv").css("display","none");
    $("#showdiv").html('');
    $("#showdiv").css("display","none");
}

</script>

 

CSS部分

#BgDiv{background-color:#e3e3e3; position:absolute; z-index:99; left:0; top:0; display:none; width:100%; height:1000px;opacity:0.7;filter: alpha(opacity=70);-moz-opacity: 0.7;}
#showdiv{position:absolute;width:480px; height:440px; left:50%; top:50%; margin-left:-240px; margin-top:-220px; height:auto; z-index:100;background-color:#fff; display:none;}

 

HTML部分

<div><a href="javascript:showDiv();">彈出層</a></div>

<div id="BgDiv"></div>

<div id="showdiv"></div>