弹窗叠层

本文标签:js,弹出窗口

如果你还不会,可以看看下面这个简单的例子 。

复制代码 代码如下:

<html>
<head>
<title>弹出一个窗口后,后面的层不可操作</title>
<script>
function show()  //显示隐藏层和弹出层
{
   var hideobj=document.getElementById("hidebg");
   hidebg.style.display="block";  //显示隐藏层
   hidebg.style.height=document.body.clientHeight+"px";  //设置隐藏层的高度为当前页面高度
   document.getElementById("hidebox").style.display="block";  //显示弹出层
}
function hide()  //去除隐藏层和弹出层
{
   document.getElementById("hidebg").style.display="none";
   document.getElementById("hidebox").style.display="none";
}
</script>
<style>
   body { margin:0px;padding:0px;text-align: center;}
   #hidebg { position:absolute;left:0px;top:0px;
     
      width:100%;  /*宽度设置为100%,这样才能使隐藏背景层覆盖原页面*/
      filter:alpha(opacity=60);  /*设置透明度为60%*/
      opacity:0.6;  /*非IE浏览器下设置透明度为60%*/
      display:none; /* http://www.jb51.net */
      z-Index:2;}
   #hidebox { position:absolute;width:400px;height:300px;top:200px;left:30%;background-color:#fff;display:none;cursor:pointer;z-Index:3;}
   #content { text-align:center;cursor:pointer;z-Index:1;}
</style>
</head>
<body>
<div id="hidebg"></div>
<div id="hidebox" onClick="hide();">点击关闭</div>
<div id="content" onClick="show();">点击试试</div>
</body>
</html>

时间: 2024-10-22 12:45:12

弹窗叠层的相关文章

移动端禁止弹窗蒙层下页面滚动

第一种简单的方法: 在弹窗出现时,在 html 上添加 class: .open-model { overflow: hidden; height: 100%; } 弹窗消失时,再 remove class 代码示例(react): import React from 'react' import {css} from 'glamor' css.global('.open-model', {overflow: 'hidden', height: '100%'}) componentDidUpda

傅里叶叠层成像FP(Fourier Ptychographic Imaging)查资料

傅里叶叠层成像FP(Fourier Ptychographic Imaging) 傅里叶叠层显微术(FPM)是一种新型的计算显微成像技术,FPM与传统显微术照明方式不同,常采用可编程LED阵列进行不同角度照明,而LED灯珠发射光强与角度有关,随角度增大光强迅速减弱,不同角度照明光强不能保证一致,导致重建图像质量下降. 因此,在进行相位迭代反演计算过程中,需要对不同角度照明拍摄的图像进行光强校正. 高分辨率是光学显微技术发展至今不断追求的目标之一. 南京理工大学陈钱教授课题组从基本原理.实验系统与

线路板的叠层设计

PCB厂家的叠层设计不是层的简单堆叠,其中地层的安排是关键,它与信号的安排和走向有密切的关系.多层板的设计和普通的PCB相比,除了添加了必要的信号走线层之外,最重要的就是安排了独立的电源和地层(铺铜层).在高速数字电路系统中,使用电源和地层来代替以前的电源和地总线的优点主要在于: 1)为数字信号的变换提供一个稳定的参考电压. 2)均匀地将电源同时加在每个逻辑器件上. 3)有效地抑制信号之间的串扰. 其原因在于,使用大面积铺铜作为电源和地层大大减小了电源和地的电阻,使得电源层上的电压均匀平稳,而且

jquery layer弹窗弹层插件 小巧强大

/* 先去官网下载最新的js  http://sentsin.com/jquery/layer/ ①引用jquery ②引用layer.min.js */ 触发弹层的事件可自由绑定,如: $('#id').on('click', function(){ layer.msg('test'); }); 下面主要贴出上述例子的调用代码: [信息框]: layer.alert('白菜级别前端攻城师贤心', 8); //风格一 layer.msg('前端攻城师贤心'); //风格二 //当然,远远不止这两

jquery layer弹窗弹层插件 (转)

/* 先去官网下载最新的js  http://sentsin.com/jquery/layer/ ①引用jquery ②引用layer.min.js */ 触发弹层的事件可自由绑定,如: $('#id').on('click', function(){ layer.msg('test'); }); 下面主要贴出上述例子的调用代码: [信息框]: layer.alert('白菜级别前端攻城师贤心', 8); //风格一 layer.msg('前端攻城师贤心'); //风格二 //当然,远远不止这两

CAM350 10.5移动和叠层的用法

1.MOVE 图线不在格点上时 (1)edit-move-----按A全选图形 (2))edit-move-----按WC框选-----右键-----移动 2.CAM350输入gerber和钢网文件对齐检查 对于两个错开的图层,当使用Move功能来对拍它们的时候,频繁的框选和开关图层会否让你稍感麻烦呢?这里就介绍Align功能,让你简单方便地就把两个层拍到一起. --_________________________________________________________________

jquery弹出层

Ug,一个轻量级的js组件.web弹窗(层)解决方案 .网址:http://ug66.cn/ 效果预览: Ug,简洁的代码.灵活的自定义,您只需简单地调用,即可轻松实现各种弹出效果. Ug,她尽可能地以更少的代码展现出更强健的功能,让您的页面拥有更丰富与便捷的UI体验. Ug.格外注重性能的提升.易用和实用性. 鄙人必须中止“王婆卖瓜”的陈述,因为一切的不足或友好,都需阁下在使用过程中去发现. jquery弹出层,布布扣,bubuko.com

【转】PADS内电层分割与铺铜

一.约定 软件:PADS LAYOUT 9.3(PADS2007也可以参考通用步骤) 二.一般步骤 多层板的分割一般步骤为:定义叠层→设置层的属性(正.负片)→分配网络→分割→铺铜. 首次定义多层板的叠层结构. 四层板堆叠一般为:SIG1/GND/POWER/SIG2: 六层板堆叠为:① SIG1/GND/SIG2/SIG3/POWER/SIG4: ② SIG1/GND1/POWER/SIG2/GND2/SIG3: 在PADS当中板层定义如下图所示: 其次,为电源层分配电源网络. 上图中强调一下

js弹出层插件 -- weebox

1.引入文件: 使用前需包含以下jquery.js.bgiframe.js.weebox.js.wee.css文件 2.基本用法举例如下: <script type="text/javascript"> $.weeboxs.open('#testbox', { title: 'hello world', width:400, height: 200 }); $.weeboxs.open('The operation failed.',{ onopen:function(){