<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>轮播广告</title> <style> body{ text-align: center; } </style> </head> <body> <h1>轮播广告</h1> <img id='img1' src="img/baidu.png" alt="广告图片" style="width: 300px;height: 150px;"> <script> var arrimgs=["img/baidu.png","img/sina.jpg","img/qq.jpg","img/sohu.jpg","img/taobao.jpg","img/jd.png"]; var imgad=document.getElementById('img1'); var i=0; function rimg(){ i++; if(i==arrimgs.length)i=0; imgad.src=arrimgs[i]; } var iv=setInterval(rimg,500); imgad.onmouseover=function(){ clearInterval(iv); } imgad.onmouseout=function(){ iv=setInterval(rimg,500); } </script> </body> </html>