原生js 弹出框;弹出效果 定时关闭
生活随笔
收集整理的這篇文章主要介紹了
原生js 弹出框;弹出效果 定时关闭
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
關于原生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>作為一個初學者 希望和大家多交流探討;
總結
以上是生活随笔為你收集整理的原生js 弹出框;弹出效果 定时关闭的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 解决Anaconda 安装创建菜单失败问
- 下一篇： 内置函数LPAD和RPAD函数