右下角的弹出广告

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <meta name="viewport"
 6           content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
 7     <meta http-equiv="X-UA-Compatible" content="ie=edge">
 8     <script src="../jquery-1.11.1.min.js"></script>
 9     <title>Document</title>
10     <style>
11         .ad{
12             width: 230px;
13             height: 120px;
14             background: url("imgs/ad.jpg");
15             position: fixed;
16             right: 0;
17             display: none;
18             bottom: 0;
19         }
20         .ad span{
21             width: 40px;
22             height: 18px;
23             background: url("imgs/h.jpg");
24             position: absolute;
25             right: 0;
26             top: 0;
27 
28         }
29     </style>
30 </head>
31 <body>
32     <div class="ad">
33         <span></span>
34     </div>
35 </body>
36 </html>
37 <script>
38    $(function(){
39     $('.ad').slideDown('slow')
40         .slideUp('normal')
41         .fadeIn(1000)
42         .children('span').click(function(){
43             $(this).parent().fadeOut();
44     })
45    })
46 </script>

 

posted @ 2018-01-01 15:00  前端极客  阅读(380)  评论(0编辑  收藏  举报