css+jQuery遮罩层

chinacq · 发表于 2013-2-8 00:52:42

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>协同工作平台后台登陆</title><script src="res/common/js/jquery.js" type="text/javascript"></script><script type="text/javascript">$(function(){$(".bg").width($("#overlay").width()); $('.bg').height($("#overlay").height()); //获取被遮罩层的定位，以实现遮罩层对被遮罩层的完美"覆盖"var position = $("#overlay").position();$('.bg').css('left',position.left); $('.bg').css('top',position.top); });</script><style type="text/css">#overlay {top: 0px;left: 0px;z-index: 100; /* 此处的图层要大于页面 */}.bg {filter: alpha(opacity = 150); /* IE的透明度 */opacity: 0.5; /* 透明度 */z-index: 200; /* 此处的图层要大于页面 */-moz-opacity:0.5;/*添上后兼容性会更好*/-khtml-opacity:0.5;/*添上后兼容性会更好*/position:absolute;/*必须是这种定位*/background-color:#000; }</style><script type="text/javascript"></script></head><body><div id="overlay" >来遮罩我…………………………</div><div class="bg"></div></body></html>

以上代码在ff gg IE8下面测试通过

		自动登录	找回密码
密码			立即注册

css+jQuery遮罩层

浏览过的版块