让DIV块保持在浏览器窗口中央位置

<html>
	<head>
		<script type="text/javascript" src="./jquery-1.4.4.js"></script>
		<style type="text/css">
			.divv
			{
			    position:absolute;
			    top:30%;
			    left:30%;
			    width:80px;
			    height:60px;
			    border:1px solid #666;
			    background-color:#9CF;
			    text-align:center;
			}
		</style>
		<script type="text/javascript">
			$(document).ready(
				function(){
					//页面初始化
					goCenter();
				
					//滚动条滚动
					$(window).scroll(
						function(){
							goCenter();
						}
					);
					//拖动浏览器窗口
					$(window).resize(
						function(){
							goCenter();
						}
					);
				}
			);
			
			function goCenter()
			{
				var h = $(window).height();
				var w = $(window).width();
				var st = $(window).scrollTop();
				var sl = $(window).scrollLeft();

				$(".divv").css("top", ((h-60)/2)+st);
				$(".divv").css("left", ((w-80)/2)+sl);
			}
		</script>
	</head>
	
	<body>
		<div class="divv">中央窗口</div>
	</body>
</html>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值