点击按钮跳出隐藏的div层,并设背景。
style:
.black_overlay{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: #696969;
z-index:;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=88);
}
.white_content {
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 55%;
height: 55%;
padding: 20px;
border: 10px solid #ddd;
background-color: white;
z-index:;
overflow: auto;
}
html:
<p>示例弹出层:<BUTTON onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">请点这里</BUTTON></p>
<div id="light" class="white_content"> 这是一个层窗口示例程序.
<BUTTON onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">点这里关闭本窗口</BUTTON>
</div>
<div id="fade" class="black_overlay"></div>
点击按钮跳出隐藏的div层,并设背景。的更多相关文章
- 点击按钮弹出一个div层
JQuery弹出层,点击按钮后弹出遮罩层,还有关闭按钮 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml& ...
- 点击按钮显示隐藏DIV,点击DIV外面隐藏DIV
点击按钮显示隐藏DIV,点击DIV外面隐藏DIV 注意:此方法对touch事件不行,因为stopPropagation并不能阻止touchend的冒泡 <style type="tex ...
- js的事件冒泡和点击其他区域隐藏弹出层
一.前言 在编写页面的时候,我们经常使用到弹出层.对于弹出层,原本的意义就是增加与用户的交互,提升用户的好感度.如果弹出层都没有较好的体验,那何谈通过交互来提升好感... 首先提出几个弹出层的注意点: ...
- 点击文字弹出一个DIV层窗口代码
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...
- javascript 点击按钮实现隐藏显示切换效果
原文链接:http://www.jb51.net/article/79083.htm <html> <head> <meta charset="gb2312&q ...
- 点击按钮对两个div的隐藏与显示进行切换
HTML: <button type="button" id="showHidden">点击切换div的隐藏与显示</button> ...
- 点击文字弹出一个DIV层窗口代码 【或FORM表单 并且获取点击按钮的ID值】
点击不同按钮咨询不同的 专家 <?php for($i=1;$i<5;$i++){ $uid=$i; //用户ID ?> <a class="a_click" ...
- JS 点击按钮后弹出遮罩层,有关闭按钮
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <t ...
- JQuery弹出层,点击按钮后弹出遮罩层,有关闭按钮
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <t ...
随机推荐
- ubuntu apt-get 时 Unable to fetch some archives, maybe run apt-get update or try with --fix-missing?
sudo cp /etc/apt/sources.list ~/ sudo wget "http://pastebin.com/raw.php?i=uzhrtg5M" -O /et ...
- Java类中中文问题
一个奇怪问题 java类中要保存一个xml文件到数据库,2种传值方式其中1种不知何故会最终导致解析xml时报错. xml文件内容由StringBuffer定义,其中一段内容如下: sb.append( ...
- CI3.0控制器下面建文件夹 访问一直404 的解决方法
在单入口文件(框架目录下面的index.php)最下面的require_once BASEPATH.'core/CodeIgniter.php';这行上面设置一个路径,是相对于conrollers文件 ...
- Apache Commons Chain
http://commons.apache.org/proper/commons-chain/ http://commons.apache.org/proper/commons-chain/cookb ...
- iPhone5停留在语音的界面,提示按三次home键,无法继续下去
不知道之前用户是怎么操作的,可能是刷机或恢复出厂设置.穷人,没用玩过iPhone. 根据提示关键词,网上搜索,发现只需要按三次home,三次锁屏,三次锁屏,最后再三次home就可以了. 试了两次,还真 ...
- BZOJ3143 [Hnoi2013]游走
首先高斯消元解出每个点被走到的概率 注意到这里走到$n$就停下来了,所以$P(n) = 0$ 解出来以后,给每条边$(u, v)$赋边权$P(u) + P(v)$即可,然后直接贪心 /******** ...
- linux php 安装 memcache 扩展
1. memcached依赖于libevent,需要先安装libevent. tar zxvf libevent-2.0.21-stable.tar.gz cd libevent-2.0.21-sta ...
- Java 和 Google Chrome 浏览器
来源:https://java.com/zh_CN/download/faq/chrome.xml 本文适用于: 浏览器: Chrome Java 版本: 7.0, 8.0 Chrome 不再支持 N ...
- sass入门教程
一.什么是SASS SASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护. 二.安装和使用 2.1 安装 SASS是Ruby语言写的,必须先 ...
- c语言基础表达式, 关系运算符, 逻辑运算符, 位运算符, 数据的取值范围, 分支结构(if...else, switch...case)
1.表达式: 表达式的判断是有无结果(值), 最简单的表达式是一个常量或变量, 如:12, a, 3 + 1, a + b, a + 5 都是表达式 2.BOOL(布尔)数据类型: c语言中除了基本数 ...