<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>点击文字弹出一个DIV层窗口代码</title>
<style>
.black_overlay{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-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 orange;
background-color: white;
z-index:1002;
overflow: auto;
}
</style>
</head>
<body>
<p>示例弹出层：<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">请点这里</a></p>
<div id="light" class="white_content">这是一个层窗口示例程序. <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">点这里关闭本窗口</a></div>
<div id="fade" class="black_overlay"></div>
</body>
</html>

Div层弹出的更多相关文章

  1. js弹出div层,弹出层页面底部出现UL出现一条线问题

    整个弹出div层,列表满一页时:底部会出现一条横线 原因:ul固定写在页面中了 解决方法: 将ul代码与li列表一样写在js中,如下 var newhtml = '<ul class=" ...

  2. div滚动条弹出层效果 （所需要的css文件和js文件，都已经上传到文件里面了progressbar.rar）

    <%--总的弹出层--%> <div class="tcck" id="joinclub" style="display:none& ...

  3. 点击图片或者鼠标放上hover .图片变大. 1)可以使用css中的transition, transform 2) 预先设置一个 弹出div. 3)弹出层 alert ; 4) 浏览器的宽度document.documentElement.clientWidth || document.body.clientWidth

    变大: 方法一: 利用css属性. 鼠标放上 hover放大几倍. .kecheng_02_cell_content img { /*width: 100px; height: 133px;*/ wi ...

  4. JavaScript动态实现div窗口弹出&消失功能

    先积累一个JavaScript动态实现div窗口弹出&消失功能 首先是index.jsp代码 <html> <head> <link rel="styl ...

  5. div+js 弹出层

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <t ...

  6. div非弹出框半透明遮罩实现全屏幕遮盖css实现

    IE浏览器下设置元素css背景为透明: background-color: rgb(0, 0, 0); filter: alpha(opacity=20); 非IE浏览器下设置元素css背景为透明: ...

  7. layer iframe层弹出图片

    这个js是在一个layer iframe弹出层中,点击按钮弹出图片

  8. js遮罩层弹出显示效果组件化

    1.在web开发中经常遇到遮罩层的效果,可以将这种常用方法通用化 function showid(idname){ var isIE = (document.all) ? true : false; ...

  9. 69.js--点击事件等比例弹出层div

    html:<!--弹出层导航栏--> <div class="public-nav-content"> <ul> <li><a ...

随机推荐

  1. jenkins 升级

    升级Jenkins Jenkins的开发迭代非常快,每周发布一个开发版本,长期支持版每半年更新一次(ps:大版本更新).如此频繁的更新,怎么升级呢? war:下载新版的war文件,替换旧版本war文件 ...

  2. 踩坑之jinja2注释问题(Flask中)

    报错信息  jinja2.exceptions.TemplateSyntaxError  jinja2.exceptions.TemplateSyntaxError: Expected an expr ...

  3. 我的Android进阶之旅------>Android编译错误java.util.zip.ZipException: duplicate entry的解决方法

    今天在Android Studio中把另外一个项目引入当前项目,编译的时候出现了java.util.zip.ZipException: duplicate entry错误. 错误如下所示: FAILU ...

  4. Centos7管理selinux及使用firewalld管理防火墙

    CentOS 7.0默认使用的是firewall作为防火墙 1.firewalld的基本使用 启动: systemctl start firewalld 查看状态: systemctl status ...

  5. oracle external密码验证

    什么是external密码验证 当OS user 中存在和DB user 同名的用户时   直接使用和DB user 同名的OS user 可以不输入密码直接登录数据库, [oracle@zxrac1 ...

  6. Ubuntu 13.04安装mysql workbench

    1.如果你没有更换源,是主服务器的官网源,这时候你可以直接用sudo apt-get install mysql-workbench来安装(前提是已经装好mysql相关服务) 2.如果你第一条装不了, ...

  7. go——变量

    在数学概念中,变量(variable)表示没有固定值且可以改变的数.但从计算机系统实现角度来看,变量是一段或多段用来存储数据的内存.作为静态类型语言,Go语言总是有固定的数据类型,类型决定了变量内存的 ...

  8. python2 跟3的区别

    1----python2:1 臃肿 , 源码的重复量很多2:语法不清晰,掺杂着 c,pyp,java,的一些陋习 python3: 几乎是重构后的源码,规范 清晰 优美 2.python的分类 分为编 ...

  9. Windows工作区目录创建

    Windows工作区目录创建批处理脚本,目的是养成工作区目录规范的好习惯. @echo off echo 'Create Jingyu Workshop!' rem Author: Alfred Zh ...

  10. 5. Longest Palindromic Substring(最长回文子串 manacher 算法/ DP动态规划)

    Given a string s, find the longest palindromic substring in s. You may assume that the maximum lengt ...