<!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 CSS遮罩层（弹窗窗口）的更多相关文章

  1. div+css遮罩层

    曾被问到这个问题,不知所措,后来在网上找到了.大神文章:http://www.cnblogs.com/aspx-net/archive/2011/03/11/1981071.html 我想实现的效果没 ...

  2. div+css 遮罩层

    CSS样式部分: ---------------------------------- <style type="text/css">#loading-mask{    ...

  3. div 遮罩层 弹窗

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. CSS遮罩层的实现

    偶然发现自己原来写了一个CSS遮罩层,虽然这个东西没什么技术含量,但如果本人离开公司后又遇见此类问题,那么可能又得花些时间来找资料了.所以决定还是把它记下来吧. 直接上代码吧. 第一步,html代码: ...

  5. 利用div实现遮罩层效果

    利用div实现遮罩层效果就是利用一个全屏.半透明的div遮住页面上其它元素,典型的例子就是百度的登录界面.下面贴出示例代码: <!DOCTYPE html> <html> &l ...

  6. CSS 遮罩层、滑出页面

    <style> .panel_bak { position:fixed; bottom:0; display:none; width:100%; margin:0px; padding:5 ...

  7. CSS遮罩层简易写法

      现在很多站点弹出框,都需要一个遮罩层.写法很多,以下是我比较喜欢的一种: .box{ position:absolute; top:0; bottom:0; left:0; right:0; ba ...

  8. 前端页面给指定的div添加遮罩层，并且带有加载中的小旋转图片

    话不多说,先上代码,其实还是比较简单的 $("<div id='shade' style='opacity:0.85;background:white'></div> ...

  9. jQuery带遮罩层弹窗实现（附源码）

    1.CSS样式 <style type="text/css"> body { font:11px/1.6em Microsoft Yahei; background:# ...

  10. css遮罩层

    父元素:position:fixed; 让子元素居中对齐:position:absolute;top:0;bottom:0;left:0;right:0;margin:auto; <style& ...

随机推荐

  1. Android studio学习笔记3

    Android studio学习笔记3 RelativeLayout常见属性 相对于父元素给控件布局 android:layout_centerHrizontal 若为ture水平居中 android ...

  2. iOS中的三种定时器

    iOS中的三种定时器 NSTimer 一.背景 定时器是iOS开发中经常使用的,但是使用不慎会造成内存泄露,因为NSTimer没有释放,控制器析构函数dealloc也没有调用,造成内存泄露. 二.使用 ...

  3. ORACLE 遇到ORA-31693 ORA-31617 ORA-19505 ORA-27037

    今天发现生产的RAC环境expdp计划任务出现报错 之前一度认为是备份目录权限的问题 官方文档: MOS参考文档:DataPump Export (EXPDP) Fails With Errors O ...

  4. Linux 服务器内存异常问题记录

    一.内存异常 1. 问题描述:服务器内存一会儿就增加1G,但也没有看到有消耗内存较大的进程:最后联想到项目最近做ARM架构适配,有变更代码,立马想到使用的SSH组件,一查看就发现有大量的进程: 解决办 ...

  5. Supervisor进程守护监控部署

    前言:Supervisor在百度百科上给的定义是超级用户,监管员.Supervisor是一个进程管理工具, 当进程中断的时候Supervisor能自动重新启动该进程.可以运行在各类Unix机器上,su ...

  6. JavaScript 数字与字符串的加减乘除运算

    点击跳转 Tips: 除开字符串 + 数字的运算,会产生级联,其他情况下会将 String 转为 number 再进行数字运算. js 运算是从左到右的,所以一步一步来,不要跳步进行运算.

  7. openGL 学习笔记 （二） 使用GL API 绘制出属于自己的矩形

    在OpenGL中所有的事物都是在3D空间中,但是我们所看到的屏幕成像却是2D的像素数组.这导致OpenGL的大部分工作就是把得到的3D坐标转换为适应屏幕的2D图像.转换的整个处理过程是由OpenGL的 ...

  8. [菜鸡随笔-2]用mv代替rm安全地进行删除操作的小技巧

    牢骚和背景介绍: rm -rf /*的梗 相信大家都听过笑过,我不止听过笑过,还不小心试过(不要熬夜写东西!).为此丢了我一周的心血,和40块钱(买u盘跑网吧下载引导文件).所幸,这只是在自己的机器上 ...

  9. jdbc（工具类和配置文件）

    原始的jdbc要操作7步 导入jar包 加载驱动 获取连接 获取执行者对象 编写sql语句 处理结果 释放对象资源 当我们每次都要注册驱动,获取连接的时候,都感觉很烦,这时候怎么才能懒呢? 把driv ...

  10. FSL--fsleyes建立软连接方法

    在使用conda下载完fsleyes后,还是显示not found ,无法使用怎么办? 1.首先在/anaconda/envs/fslpython/bin/  中搜索 fsleyes  确定已经下载好 ...