<!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>

　　

html弹出div弹窗的更多相关文章

  1. js弹窗 js弹出DIV,并使整个页面背景变暗

    1.首先写一个遮罩层div,然后再写一个弹窗的div <!-- 遮罩层 --> <div id="cover" style="background: # ...

  2. 创建一个弹出DIV窗口

    创建一个弹出DIV窗口 摘自:   http://www.cnblogs.com/TivonStone/archive/2012/03/20/2407919.html 创建一个弹出DIV窗口可能是现在 ...

  3. js点击弹出div层

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

  4. jQuery 弹出div层

    目的:使用jQuery弹出一个div窗口:这种效果经常应用于页面内容的展示,登录效果的实现.其实,实现这种效果有好多种方式: 效果如下: 代码如下: <html> <head> ...

  5. 使用js弹出div刷新时闪烁解决方法

    <div style="visibility: hidden"> //弹出div内容 </div>

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

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

  7. js弹出div层内容(按回退键关闭div层及遮罩)

    <!--弹出的div列表对应的详情--> <div id="newhtml" class="white_content"> <di ...

  8. 运用fancybox弹出div的方式弹出视频界面

    fancybox可以弹出很多窗体,甚至一个swf格式的小视频.但这样的swf视频播放的时候并没有任何的控件.只能重头看到尾,或者关闭.我们可以利用fancybox弹出div盒子的方式配合html5很快 ...

  9. 基于jquery ui修改的不依赖第三方的背景透明的弹出div

    效果图: 代码: <!doctype html> <html> <head> <meta charset="utf-8"> < ...

随机推荐

  1. mongodb聚合内存不足解决方案

    原因:mongodb每一个文档默认只有16M.聚合的结果是一个BSON文档,当超过16M大小时,就会报内存不够错误. exceeded memory limit for $group.but didn ...

  2. Another app is currently holding the yum lock; waiting for it to exit...另一个应用程序在占用yum lock，等待其退出。

    这种情况下通常是由于yum的时候意外退出造成的,虽然也给出提示当前占用进行的id,但是执行kill -9 3599 强制杀死进程后,情况依然没能改变. 备注:(-9是强制杀死) 主要原因是因为,yum ...

  3. 怎么学习C++?

    一个学习十年c++的建议如下: 其实学习C++的读书顺序应该是这样的(对于有C基础的朋友): C++ Primer Effective C++ Exceptional C++ Inside the C ...

  4. Ubuntu + CentOS7 搭建tftp Server

    基于Ubuntu系统做的tftp服务器,基于CentOS 7都差不多,书写了关键命令,测试过Ubuntu 12.0.4 和CentOS 7环境 1.介绍tftp服务器     TFTP(Trivial ...

  5. 收缩TempDB的办法（转载）

    有时候在数据库上运行一个数据量很大的查询语句,会导致TempDB数据量剧增,具体查看下面链接文章: SqlServer 一个查询语句导致tempdb增大55G 找到TempDB剧增的问题后,接下来的问 ...

  6. GPS学习

    1.每一个你不满意的现在,都有一个你没有努力的曾经. //ios根据gps坐标来计算两点间的距离 //x1,y1 点1的坐标 x2,y2点2的坐标 -(double) gps2m:(double)x1 ...

  7. linux用户栈内核栈的设置---进程的创建: fork/execve【转】

    转自:http://blog.csdn.net/u011279649/article/details/18795547 版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[-] 应用层怎 ...

  8. html5 教程网站

    html5 MDN Canvas tutorial Canvas教程 canvas: 阮一峰 在那山的那边海的那边有一群程序猿 使用 HTML5 canvas 绘制精美的图形 HTML5定稿了,为什么 ...

  9. for_each()的返回值

    有三种办法可以从“运用了function object”的算法中获取“结果”或“反馈”: 1.在外部持有状态,并让function object指向它: 2.以by reference方式传递func ...

  10. 完整学习git三 查看暂存区目录树 git diff

    1显示暂存区中的目录树 git ls-files git ls-tree git diff 魔法 1工作区与暂存区比较 git diff 2工作区与HEAD比较 git diff HEAD 3暂存区与 ...