Jquery定时弹广告

最新推荐文章于 2024-07-24 16:53:23 发布

Java香帅帅

最新推荐文章于 2024-07-24 16:53:23 发布

阅读量145

点赞数

文章标签： jquery html

本文链接：https://blog.csdn.net/qq1024609194/article/details/124577353

版权

HTML CSS JavaScript 定时器广告展示

关键词由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8">
       <title>定时弹广告</title>
       <style type="text/css">
           .logo{
               width: 300px;
               height: 120px;
               border: 4px solid black;
               position: relative;
           }
           .logo img{
               width: 100%;
               height: 80%;
           }

           .logo #close{
               display: block;
               width: 20px;
               height: 20px;
               background-color: rgba(0,0,0,0.5);
               text-align: center;
               line-height: 20px;
               color: #fff;
               position: absolute;
               right: 0;
           }
       </style>
   </head>
   <body>
       <div class="logo">
           <span id="close">
               ×
           </span>

//下面图片添加即可
           <img src="img/logo.png"/>
       </div>
   </body>
   <script type="text/javascript">
       document.getElementById('close').οnclick=function(){
           hidden();
       }

       function hidden(){
           var div = document.querySelector(".logo");
           div.style.display='none';
           setTimeout("show()",3000);
       }

       function show(){
           var div = document.querySelector(".logo");
           div.style.display='block';
       }
   </script>
</html>

Java香帅帅

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Jquery定时弹广告

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>定时弹广告</title> <style type="text/css"> .logo{ width: 300px; height: 120px; ...
复制链接

扫一扫