一个简单的图片淡出。 

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
 2 "http://www.w3.org/TR/html4/strict.dtd">
 3 
 4 <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
 5     <head>
 6         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 7         <title>html</title>
 8         <script type="text/javascript" src="script/jquery-1.12.2.js"></script>
 9         <meta name="author" content="Administrator" />
10         <style type="text/css">
11             div {
12                 border: 1px solid #0000FF;
13             }
14             img {
15                 position: absolute;
16             }
17         </style>
18         <!-- Date: 2016-04-04 -->
19     </head>
20     <body>
21         <div>
22             <img src="1.jpg" id="1" />
23             <img src="2.png" id="2" />
24             <img src="3.png" id="3" />
25             <img src="4.jpg" id="4" />
26         </div>
27         <script type="text/javascript">
28                 var n = 4;
29                 function triggle() {
30                     $("#" + n).fadeOut(3000,function(){n--;});
31                 }
32                 triggle();
33                 setInterval("triggle()", 4000);
34         </script>
35     </body>
36 </html>

 

posted @ 2016-04-05 09:14  Arther_J  阅读(164)  评论(0)    收藏  举报