1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title></title>
6 <meta charset="utf-8" />
7 <style>
8 #div1 {
9 width: 100%;
10 background: url(1.jpeg) center top no-repeat;
11 height: 400px;
12 }
13
14 input {
15 display: block;
16 width: 80px;
17 height: 40px;
18 text-align: center;
19 margin: 0 auto;
20 font-family: "微软雅黑";
21 }
22 </style>
23 <script>
24 window.onload = function () {
25 var imgs = ["1.jpeg", "2.jpeg", "3.jpeg", "4.jpeg", "5.jpeg"];
26 function show() {
27 var i = Math.ceil(Math.random() * 5);//有几张图片就乘以几
28 document.getElementById("div1").style.backgroundImage = "url(" + imgs[i - 1] + ")"
29 }
30 var timeout = setInterval(show, 1000);//每隔1秒改变一次
31
32 var x = 0;
33 document.getElementById("ip").onclick = function () {
34 document.getElementById("ip").innerHTML = x;
35 x++;
36 if (x % 2 != 0) {
37 this.style.backgroundColor = "#0ff";
38 clearInterval(timeout);
39 }
40 else {
41 this.style.backgroundColor = "#E1E1E1";
42 timeout = setInterval(show, 1000);
43 }
44 }
45 }
46 </script>
47 </head>
48
49 <body>
50 <div id="div1">
51 </div>
52 <div>
53 <input type="button" value="暂停" id="ip" />
54 </div>
55 </body>
56 </html>
JS随机抽取图片
Wesley13
• 阅读
821
点赞
收藏
