PopupDiv

最新推荐文章于 2021-06-09 23:22:27 发布

原创最新推荐文章于 2021-06-09 23:22:27 发布 · 847 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #filter #border #function #xhtml #class

技术专栏收录该内容

35 篇文章

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Popup Div</title> <mce:style type="text/css"></mce:style><style type="text/css" mce_bogus="1"> .belowdiv{ display: none; position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; background-color: gray; z-index:1001; filter:alpha(opacity=90); -moz-opacity:0.9; opacity:0.9; } .topdiv { display: none; position: absolute; top: 25%; left: 25%; width: 50%; height: 50%; padding: 16px; border:solid 1px green; background-color: white; z-index:1002; overflow:hidden; } </style> <mce:script type="text/javascript"></mce:script> </head> <body> <a href="javascript:void(0)" mce_href="javascript:void(0)" onclick="popupDiv()">Hit Me</a> <div id="below" class="belowdiv"> </div> <div id="top" class="topdiv"> hello, i'm popup div. <a href = "javascript:void(0)" onclick="hideDiv()">关闭</a> </div> </body> </html>