网页遮层
2015-08-10 14:32
309 查看
<div class="mask-cj" style="display:none; position:absolute; width:100%; height:100%; top:0; left:0; z-index:888;background:rgba(0,0,0,0.5);"> </div>
网站body顶部添加一层遮罩
方法2:
jq方法:首先引入jq
$('body').append('<div id="overlay"></div>'); $('#overlay') .height(docHeight) .css({ 'opacity': .9, //透明度 'position': 'absolute', 'top': 0, 'left': 0, 'background-color': '#abcdef', 'width': '100%', 'z-index': 5000 //保证这个悬浮层位于其它内容之上 }); setTimeout(function(){$('#overlay').fadeOut('slow')}, 3000); //设置3秒后覆盖层自动淡出 });
方法三
<div id="floatdiv"></div> <div> <p>点击任意位置清除浮层</p> </div>
#floatdiv{ display: block; position: fixed; top: 0px; bottom: 0px; right: 0px; left: 0px; width: 100%; height: 100%; background-color: #000; opacity: .3; z-index: 9999999; }
$("#floatdiv").click(function () { $("#floatdiv").hide(); } )
相关文章推荐
- UVALive 4730 Kingdom(线段树区间修改+并查集)
- 前端学习
- 不用也要知道的几种算法(PHP版本)
- (转)android自定义控件
- 学渣如何打败学霸
- oracle查看awr、addm报告
- Java面向对象的三种特性
- fcntl的close-on-exec标志
- sitemesh
- Oracle_导入大批量数据到表中的方法
- 最小二乘回归
- iOS学习笔记:UISearchBar使用
- Python入门 Python变量和数据类型
- 如何收集 NGINX 指标(第二篇)
- JS正则表达式详解
- HTML中嵌入JavaScript脚本
- Dijkstra
- 获取select赋值
- 并查集 - UVALive 6889 City Park
- 技术改变命运