Home >Web Front-end >HTML Tutorial >The simplest Div CSS pop-up layer effect_html/css_WEB-ITnose
The simplest Div CSS pop-up layer effect_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:30:59904browse
<html><head><title>简单的Div+ CSS弹出层效果</title><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><script language="javascript">function ShowDiv(s) { if(s>0) { document.getElementById('ceng').style.display='block'; document.getElementById('close').style.display='block'; }else{ document.getElementById('ceng').style.display='none'; document.getElementById('close').style.display='none'; } }</script></head><body><a href="#" onclick="ShowDiv(1)">点击弹出</a><div id="ceng" style="position:absolute;z-index:2;left:0;top:0;right:0;background-color:#000;filter:alpha(opacity=50);margin:1px 1px;display:none;width:100%;height:100%;text-align:center;"> </div><div id="close" style="position:absolute !important;left:30%;top:0px;z-index:3;border:1px solid #ff6600;background-color:#fff;margin:100px auto;padding:0px;display:none;width:400px;height:300px;text-align:right"><a href="#" onclick="ShowDiv(0)">关闭</a><div style="text-align:center;"><br>内容<br> 哇哈哈哈</div></div></body></html> The effect is as follows:
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn