关于原生js的弹出框样式 淡出淡入效果;
<!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: rgb(0, 0, 0);z-index:1001;opacity:0.8;}/* 显示层 */.white_content { display: none; position: absolute; top: 0%; left: 0%; bottom: 0%;right: 0%;margin: auto;width: 50%; height: 50%; padding: 20px; border: 10px solid orange; background-color: white; z-index:1002; } /* setTimeout("fade.style.display='none'",5000);setTimeout("light.style.display='none'",5000); 定时关闭弹出提示框*/这个不使用可以删掉`````是用来定时关闭弹出框</style> </head> <script>function my(){document.getElementById("light").style.display="block";document.getElementById("fade").style.display="block";}function mt(){document.getElementById("light").style.display="none";document.getElementById("fade").style.display="none";}</script><body> <p>示例弹出层：<a href = "javascript:void(0)" onclick = "my()">请点这里</a></p> <div id="light" class="white_content">这是一个层窗口示例程序. <a href = "javascript:void(0)" onclick = "mt()">点击关闭</a></div> <div id="fade" class="black_overlay"></div> </body> </html>
作为一个初学者 希望和大家多交流探讨;
