div效果很好的遮盖层效果
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title>DIV CSS遮罩层</title>
- <script language="javascript" type="text/javascript">
- function showdiv() {
- document.getElementById("bg").style.display ="block";
- document.getElementById("show").style.display ="block";
- }
- function hidediv() {
- document.getElementById("bg").style.display ='none';
- document.getElementById("show").style.display ='none';
- }
- </script>
- <style type="text/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: 53%; height: 49%; padding: 8px; border: 8px solid #E8E9F7; background-color: white; z-index:1002; overflow: auto;}
- </style>
- </head>
- <body>
- <input id="btnshow" type="button" value="Show" onclick="showdiv();"/>
- <div id="bg"></div>
- <div id="show">测试
- <input id="btnclose" type="button" value="Close" onclick="hidediv();"/>
- </div>
- </body>
- </html>
div效果很好的遮盖层效果的更多相关文章
- 利用div实现遮罩层效果
利用div实现遮罩层效果就是利用一个全屏.半透明的div遮住页面上其它元素,典型的例子就是百度的登录界面.下面贴出示例代码: <!DOCTYPE html> <html> &l ...
- 弹窗层效果的实现(非jQuery实现)
要想实现弹窗的效果,首先应该创建一个覆盖层maskLayer,以及一个显示层presentLayer. 其次,每次弹窗时(除首次弹窗外),maskLayer的显示以及隐藏不应该导致文档流的reflow ...
- jquery制作弹出层带遮罩效果,点击阴影部分层消失
jquery制作弹出层带遮罩效果,点击阴影部分层消失. 整体还是比较简单的. HTML代码很简单 <a href="#" class="big-link" ...
- Web 开发中很实用的10个效果【附源码下载】
在工作中,我们可能会用到各种交互效果.而这些效果在平常翻看文章的时候碰到很多,但是一时半会又想不起来在哪,所以养成知识整理的习惯是很有必要的.这篇文章给大家推荐10个在 Web 开发中很有用的效果,记 ...
- Fancybox丰富的弹出层效果
Fancybox是一款优秀的jquery插件,它能够展示丰富的弹出层效果.前面我们有文章介绍了facybox弹出层效果,相比facybox,fancybox显得功能更为齐全,它除了可以加载DIV,图片 ...
- 纯CSS3写的10个不同的酷炫图片遮罩层效果【转】
这个是纯CSS3实现的的10个不同的酷炫图片遮罩层效果,可以欣赏一下 在线预览 下载地址 实例代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 ...
- Android 遮罩层效果
(用别人的代码进行分析) 不知道在开发中有没有经常使用到这种效果,所谓的遮罩层就是给一张图片不是我们想要的形状,这个时候我们就可以使用遮罩效果把这个图片变成我们想要的形状,一般使用最多就是圆形的效果, ...
- 纯CSS3写的10个不同的酷炫图片遮罩层效果
这个是纯CSS3实现的的10个不同的酷炫图片遮罩层效果,可以欣赏一下 在线预览 下载地址 实例代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...
- [转]jquery Fancybox丰富的弹出层效果
本文转自:http://www.helloweba.com/view-blog-65.html Fancybox是一款优秀的jquery插件,它能够展示丰富的弹出层效果.前面我们有文章介绍了facyb ...
随机推荐
- glusterfs4.0.1 mempool 分析笔记
关于3.2.5版本分析,详见<GlusterFS之内存池(mem-pool)实现原理及代码详解> 此4.0.1版本内存池与版本3中的描述变化有点大,总的原理还是类似LINUX中的SLAB算 ...
- java的迭代器详解
迭代器的引出 在jdk1.5版本之前是没有 foreach的,然而1.5版本就加上了foreach,而引入的新的foreach功能并不是在jvm上进行改进的因为代价太高,甲骨文工程师想到了一个比较好的 ...
- jquery easyui datagrid detailview groupview添加自定义视图view
var myview = $.extend({}, $.fn.datagrid.defaults.view, { onAfterRender: function (target) { $.fn.dat ...
- Python小代码_7_字符串的字符次数统计
生成包含 1000 个随机字符的字符串,并统计每个字符出现的次数. import string import random #获取字符 x = string.ascii_letters + strin ...
- 什么样的简历受HR青睐?
简历是我们在求职过程中的名片,那么如何写出更容易受到HR青睐的简历呢? HR可能一天要看上百份的简历,他们都希望能够尽快筛选出合适的人,然后用更多的时间去跟候选人沟通.所以招聘人员一般看一份简历只会花 ...
- 码农代理免费代理ip端口字段js加密破解
起因 之前挖过爬取免费代理ip的坑,一个比较帅的同事热心发我有免费代理ip的网站,遂研究了下:https://proxy.coderbusy.com/. 解密 因为之前爬过类似的网站有了些经验,大概知 ...
- UltraISO安装centos7系统
1. 使用最新版UltraISO将ISO镜像刻录到U盘一定要是最新版,试用版都可以,按下图操作: 2. U盘启动电脑进入安装界面正常情况下你应该会看到下面的这个界面: 选择第一项,然后按TAB键(在评 ...
- JBOSS EAP实战(1)
JBOSS的诞生 1998年,在硅谷SUN公司的SAP实验室,一个年轻人正坐在电脑前面思考,然后写着什么东西.不,他没有在写程序,他在写辞呈.他正在做出人生的一个重大决定:他要辞掉在SUN的这份工作, ...
- Redis监控工具,命令和调优
Redis监控工具,命令和调优 1.图形化监控 因为要对Redis做性能测试,发现了GitHub上有个python写的RedisLive监控工具评价不错.结果鼓捣了半天,最后发现其主页中引用了Goog ...
- STATE(状态)模式
引子 场景 在我们软件开发的过程中,有许多对象是有状态的.而对象的行为会随着状态的改变而发生改变.例如开发一个电梯类,电梯有开门.关门.停止.运行等行为,同时电梯也会有开门状态.关门状态.停止状态.运 ...