리뷰하고 기록하기
php_layerPop 본문
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<style type="text/css">
#mask {
position:absolute;
left:0;
top:0;
z-index:9000;
background-color:#CDCDCD;
display:none;
overflow:hidden;
}
#div01
{
top:10px;left:10px;width:300px;height:200px;
background-color:#60D029;
border:3px solid #2CB400;
display:none;
z-index:9001;
font-size:1.5em;
color:#4D4D4D;
}
</style>
<script type="text/javascript">
function showLayer() {
var maskHeight = "";
var maskWidth = "";
if (screen.width < $(document).width()) {
maskWidth = $(document).width();
} else {
maskWidth = screen.width;
}
if (screen.height < $(document).height()) {
maskHeight = $(document).height();
} else {
maskHeight = screen.height;
}
$('#mask').css({ 'width': maskWidth, 'height': maskHeight });
$("#div01").css({
"top": 0
, "position": "absolute"
, "left": 0
, "margin-left": ($(window).width() - 680) / 2
, "margin-top": ($(window).height() - 440) / 2
});
$('#mask').fadeIn(1000);
$('#mask').fadeTo("fast", 0.7);
$('#div01').fadeTo("fast", 1);
}
</script>
</head>
<body>
<div id="mask"></div>
<input id="Button1" type="button" value="Layer 띄우기" onclick="showLayer(1)"/>
<div id="div01" >DIV1</div>
</body>
</html>
'beauty' 카테고리의 다른 글
| mysql_Convert (0) | 2014.11.21 |
|---|---|
| php_cutStr (0) | 2014.11.21 |
| php_selectSubmit (0) | 2014.11.21 |
| php_selectOpen (0) | 2014.11.21 |
| jquery_onlyNumber (0) | 2014.11.21 |