文档章节

遮罩层整理

秦学强
 秦学强
发布于 2017/07/09 22:04
字数 119
阅读 5
收藏 0

css部分:

#bg{ display: none;  position: absolute;  top: 0%;  left: 0%;  
		width: 100%;  height: 100%;  background-color: black;  z-index:1001; 
		-moz-opacity: 0.7;  opacity:.70;  filter: alpha(opacity=70);}
	#show{display: none;  position: absolute;  top: 25%;  left: 22%;  
	   	width: 680px;  height: 380px;  padding: 8px;  border: 8px solid #E8E9F7;  
	   	background-color: white;  z-index:1002;  overflow: auto;}

js部分:

//遮罩层
		function showdiv() {   
			document.getElementById("bg").style.display ="block";
            document.getElementById("show").style.display ="block";
			//$("#bg").css("display","block");
			//$("#show").css("display","block");
        }
		function hidediv() {
			document.getElementById("bg").style.display ='none';
            document.getElementById("show").style.display ='none';
			//$("#bg").css("display","none");
			//$("#show").css("display","none");
        }


html部分:

<!-- 遮罩层 -->
	 <div id="bg"></div>
	 <div id="show" class="alert alert-success" role="alert">

	 </div>



本文转载自:http://blog.csdn.net/u014481096/article/details/45502943

共有 人打赏支持
秦学强

秦学强

粉丝 0
博文 69
码字总数 0
作品 0
海淀
程序员
私信 提问
jQuery实现带遮罩层的消息框滑入滑出效果

首先,使用一个遮罩层来遮住整个页面,在遮罩层上显示一个消息框,消息框还可以被关闭,最后使用jQuery使得消息框从页面顶部滑下,实现的效果如下: 遮罩层的样式如下: 样式说明了不论在哪种...

罗盛力
2012/02/17
0
1
实现新手引导简单遮罩(无需shader)

效果如下: 大部分教程都有shader实现遮罩,shader可以控制更好效果的遮罩。unity自带的功能也能实现简单的新手引导遮罩,只是unity自带的遮罩会有锯齿。之后再更新加shader的版本。 以下是具...

lisa0626
2018/04/25
0
0
JS实现遮罩层

用JS实现一个常见的遮罩层,该遮罩层包含三部分(触发按钮,透明遮罩层,弹出对话层),并分解各部分(分为HTML,CSS,JavaScript),逐一讲解实现的机理。最终效果如下图: HTML结构 一个用来触...

MangoGan
2017/11/24
0
0
【功能】遮罩层实现

遮罩层固定于窗口中央,不会随滚动条滑动。 遮罩层实现: <style type="text/css">/遮罩层 CSS/ #close{ text-shadow: 0 1px 0 #fff; opacity: .2; filter: alpha(opacity=20); width:30px; ......

霞女
2016/01/12
15
0
小程序 textarea组件层级过高导致文字穿透浮层的一个解决方法

最近做的一个小程序需求,其中一个页面使用到了 这个小程序组件,然后点击页面上的某个元素,会触发页面弹起一个弹窗,这时发现 的 文字或者输入的文字内容,会直接穿透遮罩层和浮动弹窗,显...

清夜
2018/08/08
0
0

没有更多内容

加载失败,请刷新页面

加载更多

听说拼多多因漏洞被薅了200亿?- 谈谈软件测试

昨天看到一个大新闻:拼多多在20日凌晨出现漏洞,用户可以领100元无门槛优惠券。一夜之间,被黑产、羊毛党和闻讯而来的吃瓜群众薅了个底朝天,直到第二天上午9点才将优惠券下架。网上传言这一...

crossin
24分钟前
2
0
微服务架构有毒,何时不使用微服务?

在过去的四年中,使用微服务来构建应用程序似乎成了一种标准。大多数我所合作过的团队也对此表现出了不同程度的兴趣。 微服务所承诺的弹性、高可用、低耦合、敏捷,以及能够解决单体架构带来...

架构师springboot
30分钟前
2
0
日志服务Python消费组实战(三):实时跨域监测多日志库数据

摘要: 本文主要介绍如何使用消费组实时监控多个域中的多个日志库中的异常数据,并进行下一步告警动作。具备配置简单、逻辑灵活、支持跨域多Region、实时监测,无需配置索引等特点,并且性能...

阿里云云栖社区
30分钟前
2
0
常用css动效

1.列表浮层变化动效 demo地址 下载地址 2.js动画库 github地址 3.滚动加载 Scrollreveal 4.其他动效 tobiasahlin

chinahufei
31分钟前
2
0
Coding and Paper Letter(四十六)

资源整理。 1 Coding: 1.卫星影像深度学习资源。 satellite image deep learning 2.runoff tools为MOM生成径流文件的一些工具变得轻而易举。 runoff tools 3.NOAA-GFDL海冰模拟器V2.0。 SIS2...

胖胖雕
33分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部