div弹出效果css及js

来源：懂视网责编：小采时间：2020-11-27 18:53:55

div弹出效果css及js

div弹出效果css及js:直接上代码：html代码：Html代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>testdiv</title> <link rel=&

推荐度：

点击下载本文 文档为doc格式

导读div弹出效果css及js:直接上代码：html代码：Html代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>testdiv</title> <link rel=&

直接上代码：
html代码：

Html代码 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
 
<title>testdiv</title> 
 
<link rel="stylesheet" type="text/css" media="screen" href="http://www.php1.cn/"> 
<script src="div.js" type="text/javascript"></script> 
</head> 
<body> 
<a href="http://www.php1.cn/"> <a href="http://www.php1.cn/"> <div id="light" class="white_content"> 
 <div class="close"><a href="http://www.php1.cn/"> <div class="con"> 
 问题描述：<input type="text" /><br> 
 问题类型：<select ><option value="1">1</option><option value="2">2</option></select><br> 
 意见描述：<input type="text"/> 
 </div> 
</div> 
<div id="light2" class="white_content"> 
 <div class="close"><a href="http://www.php1.cn/"> <div class="con"> 
 content2 
 </div> 
</div> 
<div id="fade" class="black_overlay"></div> 
</body> 
</html>

js代码：

Js代码 
function show(tag){ 
 var light=document.getElementById(tag); 
 var fade=document.getElementById('fade'); 
 light.style.display='block'; 
 fade.style.display='block'; 
 } 
function hide(tag){ 
 var light=document.getElementById(tag); 
 var fade=document.getElementById('fade'); 
 light.style.display='none'; 
 fade.style.display='none'; 
} 
 
css代码：
Js代码 
* { 
 margin:0; 
 padding:0 
} 
html, body { 
 height: 100%; 
 width: 100%; 
 font-size:12px 
} 
.white_content { 
 display: none; 
 position: absolute; 
 top: 25%; 
 left: 25%; 
 width: 30%; 
 padding: 6px 16px; 
 border: 12px solid #D6E9F1; 
 background-color: white; 
 z-index:1002; 
 overflow: auto; 
} 
.black_overlay { 
 display: none; 
 position: absolute; 
 top: 0%; 
 left: 0%; 
 width: 100%; 
 height: 100%; 
 background-color:#f5f5f5; 
 z-index:1001; 
 -moz-opacity: 0.8; 
 opacity:.80; 
 filter: alpha(opacity=80); 
} 
.close { 
 float:right; 
 clear:both; 
 width:100%; 
 text-align:right; 
 margin:0 0 6px 0 
} 
.close a { 
 color:#333; 
 text-decoration:none; 
 font-size:14px; 
 font-weight:700 
} 
.con { 
 text-indent:1.5pc; 
 line-height:21px 
}

div弹出效果css及js

div弹出效果css及js:直接上代码：html代码：Html代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>testdiv</title> <link rel=&

推荐度：

点击下载本文 文档为doc格式

标签：特效弹出 js

热门焦点

div弹出效果css及js

div弹出效果css及js

div弹出效果css及js

最新推荐

猜你喜欢

热门推荐