#brg
{
width: 100%;
height: 100%;
background: #333;
position: absolute;
top: 0;
left: 0;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
position: absolute;
top: 0;
left: 0;
display: none;
}
#showdiv
{
width: 100%;
height: auto;
position: absolute;
left: 300px;
top: 150px;
z-index: 330;
display: none;
}
#testdiv
{
width: 800px;
height: auto;
margin: 0 0;
border: 1px solid #4d4d4d;
background: #f2f2f2;
}
#close
{
width: 200px;
height: 27px;
line-height: 27px;
font-size: 14px;
font-weight: bold;
border: 1px solid #4d4d4d;
text-align: center;
cursor: pointer;
margin: 0 auto;
background: #333;
color: #fff;
}
<div id="brg">
</div>
<div id="showdiv">
<div id="close">
关闭
</div>
<div id="testdiv">
要显示的内容
</div>
</div>
$(document).ready(function() {
var bheight = document.body.clientHeight;
$("#btnAdd").click(function() {
$("#brg").css("display", "block");
$("#showdiv").css("display", "block");
$("#brg").css("height", document.body.scrollHeight);
$("#showdiv").css("top", document.body.scrollTop + 100);
});
$("#close").click(function() {
$("#brg").css("display", "none");
$("#showdiv").css("display", "none");
});
});
分享到:
相关推荐
jquery遮罩层,案例简单,容易看懂。使用了jquery,案例展示显示遮罩层和3秒后隐藏遮罩层
非常简单的jquery遮罩层鼠标点击按钮放大展开动画弹出框 非常简单的jquery遮罩层鼠标点击按钮放大展开动画弹出框
jquery开发的遮罩层组件,包含提示和自定义显示,代码简单.
使用很简单,容易扩展,可以自己二次开发,满足自己的需求,搜索了很多遮罩层例子,代码都相当的多,不好用,这个还不错
在附件包中的示例中,主要给出了jQuery遮罩层登陆效果,另外它还可以展示隐藏的页面内容,整个插件大小只有780bytes,可灵活变化高度和宽度,没有用到任何图片,支持在一个页面中创建多个实例,非常适合于创建:登录...
主要介绍了jQuery遮罩层实现方法,结合实例形式较为详细的分析了jQuery遮罩层样式及功能实现技巧,并附带分析了一个简单jQuery遮罩层插件实现方法,需要的朋友可以参考下
本文实例讲解了jquery遮罩层,包括遮罩层的不同样式实现、mask实现遮罩层等,分享给大家供大家参考,具体内容如下 一、jQuery实现遮罩层的不同样式 1.1 背景半透明遮罩层样式 需要一个黑色(当然也可以其他)背景,...
底部弹出遮罩层css 点击显示遮罩层,弹窗从下面滑出。 分享给需要的同学。 个人平时用的可以更改,非常简单
这是在学习用jQuery弹出遮罩层的过程中,动手实践的几个例子的综合,几个例子简单易懂,具有一定的代表性,希望对初学者有一定的帮助。
介绍了简单的Jquery遮罩层代码实例,有需要的朋友可以参考一下
简单易于学习的遮罩层,修改简单,代码少,没有特定样板,随心所欲的修改。适合移动端。
主要介绍了jQuery超简单遮罩层实现方法,结合实例形式详细分析了jQuery遮罩层相关属性样式动态控制操作技巧,需要的朋友可以参考下
一款简单易用的jquery插件showLoading,可以有效防止页面重复提交问题,注意,使用的时候如果涉及到ajax,要将asyc设为true,否则不生效
一款JavaScript开发的弹出层,代码简洁,使用的漂亮弹出层 可拖动的弹出层 遮罩层。
实现弹出网页遮罩层,可兼容IE6/IE7/IE+++等; 缩放浏览器时,内容狂始终居中; 有点小bug,在IE6下,遮罩层颜色没透明,屎黑色,等我有空完善下。
自己原创的一款简单的jQuery弹出遮罩层小插件,弹出的层可移动、也可以关闭,时间关系没有进行美化,经过测试在IE6、7、8下都没有问题,其它浏览器没有测试。
Jquery简单的弹出层带遮罩插件本文由梦三秋于2011年01月07日 23:00作成 jquery代码 $("#test1").click(function(){ $('#login').skygqbox(); }); -----------------------------------------------------...
一款好用的JS遮罩层工具,可在页面加载时调用,页面加载完成后显示