Home > Developer > Web Develop
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/>
<title> fillet pop-up layer div css</title>
<style>
body{font-size:12px;}
. tit{font-size:14px; padding:0; margin:0; height:31px; line-height:31px; Background:url (/jscss/demoimg/201309/ Titbg.gif) center top repeat-x #CBE4EF;}
. Tit b{float:left; margin-left:15px;}
. Tit a{float:right; margin-right:5px; margin-top:6px; display:inline;}
a.cls{height:18px; width:18px;display:block; overflow:hidden; line-height:200px;}
. nr{padding:10px; text-align:left;}
A.cls,a.cls:link,a.cls:visited{background:url (/jscss/demoimg/201309/cls.gif) center 0 no-repeat;}
A.cls:hover{background:url (/jscss/demoimg/201309/cls.gif) center-20px no-repeat;}
. box{border:1px #999999 solid; background: #FFF;}
/* Rounded Border */
. lt,.rt,.lb,.rb{Background-image:url (/jscss/demoimg/201309/abg.png); Filter:alpha (opacity=10);-moz-opacity:.1;o pacity:.1;line-height:0;}
. lt,.rt,.lb,.rb{height:6px;width:6px;}. t,.b,.l,.r{background: #000000; Filter:alpha (opacity=10);-moz-opacity:.1;opacity:.1;line-height:0;}
. l,.r{width:6px;}. t,.b{height:6px;}. lt{background-position:0 0;}. rt{background-position:right 0;}. lb{background-position:0 Bottom;}. rb{Background-position:right Bottom;}
/* Small triangle */
s{position:absolute;top:-13px;*top:-13px;left:50px;display:block;height:0;width:0;font-size:0; line-height:0; Border-color:transparent Transparent #666 transparent;border-style:dashed dashed solid dashed;border-width:10px;}
i{position:absolute;top:-9px;*top:-9px;left:-10px;display:block;height:0;width:0;font-size:0;border-width:10px ;
Line-height:0;border-color:transparent Transparent #FFF transparent;border-style:dashed dashed solid dashed;}
. open{position:relative; width:150px; height:25px;line-height:180%; border:1px solid #FF9900; background: #FFCC00; margin:12% Auto 0 400px; Text-align:center;}
. open span{cursor:pointer; display:block; width:100%;}
. odiv{Position:absolute; top:29px; left:-1px; width:300px;}
</style>
<script type= "Text/javascript" >
function Openshutmanager (osourceobj,otargetobj,shutable,oopentip,oshuttip) {
var sourceobj = typeof Osourceobj = = "string"? document.getElementById (osourceobj): osourceobj;
var targetobj = typeof Otargetobj = = "string"? document.getElementById (otargetobj): otargetobj;
var opentip = Oopentip | | "";
var shuttip = Oshuttip | | "";
if (targetobj.style.display!= "None") {
if (shutable) return;
Targetobj.style.display= "None";
if (Opentip && shuttip) {
sourceobj.innerhtml = Shuttip;
}
} else {
targetobj.style.display= "Block";
if (Opentip && shuttip) {
sourceobj.innerhtml = Opentip;
}
}
}
</script>
<body>
<div class= "Open" ><span onclick= "Openshutmanager (This, ' box ', False, ' Click here, close layer ', ' Click here, popup layer ')" > click here, pop-up layer </span>
<div class= "Odiv" id= "box" style= "Display:none" ><table border= "0" cellpadding= "0" cellspacing= "0" >
<TR><TD class= "LT" ></td><td class= "T" ></TD><TD class= "RT" ></td></tr ><TR><TD class= "L" ></td><td class= "box" >
<div class= "NR" > Hint: <br/>
1, in the code state using [html][/html] can be labeled "Code Run" code. and disable URL recognition and label parsing on the left side of the post <br/>
2, technical layout do not pour water. A particularly popular theme can be a top-of-the-box, but please accept the moderator's regular "wipe", which is to reduce the invalid information appearing in the technical discussion area. <br/>
3, if you need to collect the theme, please use the link in the upper right corner of the theme, you can also recommend to friends in the forum. <br/>
<b> This method is simple, adaptive content is wide, easy to change style. </b>
</div>
</TD><TD class= "R" ></td></tr><tr><td class= "lb" ></td><td class= "B" ></TD><TD class= "RB" ></td></tr></table><s><i></i></s>
</div>
</div>
</body>
A great God wrote the paste came to learn from everyone
JS popup with a close button 2
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
