1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style type="text/css"> 7 body{ 8 background-image: url(img/bjsky.jpg); 9 background-repeat: no-repeat; 10 background-size: 1600px 800px; 11 } 12 a{ 13 font-size: 25px; 14 color: white; 15 } 16 17 .div1{ 18 300px; 19 height: 200px; 20 background-color: gray; 21 text-align: center; 22 } 23 24 input{ 25 40px; 26 height:30px; 27 } 28 </style> 29 <script type="text/javascript"> 30 var i = -1; 31 function changebg(){ 32 var arr= ["bjsky.jpg","mayun.jpg","simple.jpg","sxt.jpg","zgc.jpg"]; 33 if (i<arr.length-1){ 34 i++; 35 }else{ 36 i = 0; 37 } 38 39 document.body.style.backgroundImage = "url(img/"+arr[i]+")"; 40 } 41 42 function move(){ 43 var div = document.getElementById("div_1"); 44 div.style.marginTop = Math.random()*500+"px"; 45 div.style.marginLeft= Math.random()*800+"px"; 46 } 47 48 function changeclk(){ 49 document.body.style.backgroundImage = "url(img/1.jpg)"; 50 document.getElementById("div_1").style.display = "none"; 51 } 52 </script> 53 54 55 </head> 56 <body> 57 <a href="javascript:changebg()">点击更换背景图片</a> 58 59 <div class="div1" id="div_1"> 60 <h3>我是不是很帅</h3> 61 <input type="button" name="" id="" value="是" onclick="changeclk()"/> 62 <input type="button" name="" id="" value="否" onmousemove="move()"/> 63 </div> 64 </body> 65 </html>