点击文字弹出一个DIV层窗口代码

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

来自:http://www.codefans.net/jscss/code/95.shtml

时间: 2024-08-06 03:46:19

点击文字弹出一个DIV层窗口代码的相关文章

点击文字弹出一个DIV层窗口代码 【或FORM表单 并且获取点击按钮的ID值】

点击不同按钮咨询不同的 专家 <?php for($i=1;$i<5;$i++){ $uid=$i; //用户ID ?> <a class="a_click" href="javascript:;" onclick="add_to_uid(<?=$uid?>)">点击弹框</a> <?}?> <div class="form1" id="form

js Ajax点击链接弹出一个DIV层窗口

下面是在实际项目中截取的部分代码,如果你想下载下来直接使用,可以点击这里点击文字弹出一个DIV层窗口代码. 效果图 HTML代码 <div class="cb pt10 mlf10"> <a href="__APP__/Article/chatpwd/value/7" onclick="verify(this);return false;" target="_blank" class="button

点击按钮弹出一个div层

JQuery弹出层,点击按钮后弹出遮罩层,还有关闭按钮 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery弹出层效果</title> <meta content="网页特效,特效代码,jQuery,css特效,Js代码" name="keywords" /> <

页面table的每行都有一个&lt;input type=&#39;button&#39; /&gt;,如何实现点击按钮在按钮下方弹出一个div,点击空白消失

\ <input id="test" type="button" />/*按钮*/ <div id="tanchu"></div> <script language="javascript"> $(document).ready(function(e) { $("#test").click(function(e) { $("#tanchu"

javascript弹出可以拖动的窗口代码实例

javascript弹出可以拖动的窗口代码实例: 在很多网页效果中,点击网页的某个地方能够弹出一个窗口,并且能够在屏幕中随便拖动,非常的人性化,下面就是一段能够实现此功能的代码实例,希望能够对大家带来帮助,代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.

根据juery CSS点击一个标签弹出一个遮罩层的简单示例

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script src="JS/JavaScript/jq

jQuery点击图片弹出大图遮罩层

使用jQuery插件HoverTreeShow弹出遮罩层显示大图 效果体验:http://hovertree.com/texiao/hovertreeshow/ 在开发HoverTreeTop项目的产品展示功能过程中,因为要把产品图片的大图显示给用户看,就使用jQuery制作了一个插件:HoverTreeShow ,使用该插件可以很方便的弹出图片的大图,已经运用在项目中了,除了上面链接的示例外,HoverTreeTop项目的产品展示也是一个实例,请访问链接:http://hovertree.co

点击cell弹出一个日期选择器

- (void)setUpGroup2 { ILGroupItem *group = [[ILGroupItem alloc] init]; // 结束时间 ILSettingItem *endTime = [ILSettingItem itemWithImage:nil title:@"结束时间"]; endTime.subTitle = @"23:59"; // __unsafe_unretained __weak // __weak会把指针自动清空 p = n

MySql总是弹出一个mySqlInstallerConsole的窗口

MySQLInstallerConsole.exe程序偶尔自动弹出执行的问题. 这是一条安装命令,Installing MYSQL 5.7 using MySQLInstallerConsole.exe 使用它可以设置一些下载安装包,当然使用的是默认安装不需人工干预. 关掉它也没有什么影响,win10状态下,从开始---->所有应用----->管理工具----->任务计划程序---->左侧任务计划程序库文件夹,展开文件夹---->mYsql子文件夹installer,点击.在