<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> pop window </title>
<style type="text/css">
.popup {
display: none;
background: #333;
padding: 10px;
border: 2px solid #ddd;
position: fixed;
top: 50%;
left: 50%;
width:200px;
height:100px;
z-index: 99999;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>
<body style="width:798px;height:1900px;border:1px solid red;margin:auto">
<button id="btn" style="float: left;width: 50px;margin-top: 500px;">click</button>
<div class='popup'>11</div>
</body>
<script type="text/javascript" >
$('#btn').click(function() {
$(".popup").fadeIn(300);
var popMargTop = $(".popup").height() / 2;
var popMargLeft = $(".popup").width() / 2;
$(".popup").css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
return false;
});
$(".popup").click(function(){
$(this).fadeOut(300);
return false;
});
</script>
</html>
jquery 居中弹框
最新推荐文章于 2019-06-18 08:12:14 发布
1125
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
