zoukankan      html  css  js  c++  java
  • javascript实战——广告弹窗实现

    效果展示:

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>标题</title>
     6     <style type="text/css">
     7         #ad{
     8             width: 300px;
     9             height: 300px;
    10             background-color: aquamarine;
    11             position: fixed;
    12             bottom: 0px;
    13             right: 0px;
    14             display: none;
    15         }
    16     </style>
    17     <script type="text/javascript">
    18         function init() {
    19             window.setTimeout(showAd,2000)
    20         }
    21         function showAd() {
    22             var ad = document.getElementById("ad");
    23             ad.style.display="block";
    24         }
    25         function closeAd() {
    26             var ad = document.getElementById("ad");
    27             ad.style.display="none";
    28         }
    29     </script>
    30 </head>
    31 <body onload="init()">
    32     <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
    33     <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
    34     <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
    35     <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
    36     <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
    37     <div id="ad">
    38         <button onclick="closeAd()">关闭</button>
    39     </div>
    40 </body>
    41 </html>
  • 相关阅读:
    QuickSort
    Java细节
    Java
    Prime
    apache和tomcat有什么不同,为什么要整合apache 和tomcat?
    java线程面试题及答案
    Struts2中的ModelDriven机制及其运用
    Java中instanceof关键字的用法总结
    spring特点与好处
    spring与struts有什么区别?
  • 原文地址:https://www.cnblogs.com/zzmx0/p/12575419.html
Copyright © 2011-2022 走看看