<!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());
//获取被遮罩层的定位,以实现遮罩层对被 遮罩层的完美"覆盖"
[color=red]var position = $("#overlay").position();[/color] $('.bg').css('left',position.left);
$('.bg').css('top',position.top);
});
</script>
<style type="text/css">
#overlay {
top: 0px;
left: 0px;
z-index: 100; /* 此处的图层要大于页面 */
}
.bg {
[color=blue]filter: alpha(opacity = 150); /* IE的透明度 */
opacity: 0.5; /* 透明度 */[/color] z-index: 200; /* 此处的图层要大于页面 */
-moz-opacity:0.5;/*添上后兼容性会更好*/
-khtml-opacity:0.5;/*添上后兼容性会更好*/
[color=blue]position:absolute;/*必须是这种定位*/
background-color:#000; [/color]}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<div id="overlay" >来遮罩我…………………………</div>
<div class="bg"></div>
</body>
</html>
以上代码在ff gg IE8下面测试通过
分享到:
相关推荐
jquery遮罩层 jquery遮罩层 jquery遮罩层 jquery遮罩层
jQuery css3打开遮罩图片形状过渡动画效果
jQuery,CSS实现的遮罩层消息显示,背景变暗,弹出层方式,滑上,滑下。
简单易于学习的遮罩层,修改简单,代码少,没有特定样板,随心所欲的修改。适合移动端。
jQuery手机端遮罩层弹出菜单CSS3动画出现和消失代码
jQuery+CSS写的打开和关闭遮罩层
这是一款效果非常炫酷的jQuery和CSS3图片遮罩层和lightbox动画特效。该特效使用CSS3来制作鼠标滑过图片时的遮罩层动画效果,并使用magnific-popup.js来制作点击图片后的Lightbox特效。
jQuery+CSS3遮罩弹出层动画代码.zip
jquery+css实现的,点击图片或链接弹出遮罩层,并且图片放大展示的一套demo
这是一款效果非常炫酷的jQuery和CSS3图片遮罩层和lightbox动画特效。该特效使用CSS3来制作鼠标滑过图片时的遮罩层动画效果,并使用magnific-popup.js来制作点击图片后的Lightbox特效。
底部弹出遮罩层css 点击显示遮罩层,弹窗从下面滑出。 分享给需要的同学。 个人平时用的可以更改,非常简单
有js+css和jquery+css实现的弹出居中的遮罩层,兼容IE6 7 8 和ff
本文实例讲解了jquery遮罩层,包括遮罩层的不同样式实现、mask实现遮罩层等,分享给大家供大家参考,具体内容如下 一、jQuery实现遮罩层的不同样式 1.1 背景半透明遮罩层样式 需要一个黑色(当然也可以其他)背景,...
比起使用注册页和登陆页,网站在当前页使用遮罩层注册和登陆的用户体验要好不少。这里使用jQuery和CSS实现一个简单的遮罩效果。
本文实例分析了jQuery遮罩层实现方法。分享给大家供大家参考,具体如下: 1 背景半透明遮罩层样式 需要一个黑色(当然也可以其他)背景,且须设置为绝对定位,以下是项目中用到的css样式: /* 半透明的遮罩层 */ #...
jQuery和CSS3超酷图片遮罩层和lightbox动画特效.zip
这是一款jQuery图片添加渐变遮罩层插件。通过该插件,可以为一副背景图片添加指定的渐变遮罩层。该插件支持CSS mix-blend-mode混合模式。