1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8" />
5 <title>图片轮播+定时广告</title>
6 <meta name="viewport" content="width=device-width, initial-scale=1">
7 <script>
8 function init(){
9 setInterval("test()",1000);
10 //2秒后显示广告 不加var是成员变量可以直接用,加了var就变成了局部变量
11 time=setInterval("showAd()",2000);
12 }
13 var i=1
14 function test(){
15 i++;
16 if(i==4){
17 i=1;
18 }
19 //获取图片位置并设置src属性值
20 document.getElementById("imgid").src="../img/"+i+".jpg";
21 }
22 // 定时广告
23 //书写显示广告图片的函数
24 function showAd(){
25 //获取广告图片的位置并修改广告图片元素里面的属性让其显示
26 var adEle = document.getElementById("advertising");
27 adEle.style.display = "block";
28 //清除显示图片的定时操作
29 clearInterval(time);
30 //设置隐藏图片的定时操作
31 time = setInterval("hiddenAd()",3000);
32 }
33 //书写隐藏广告图片的函数
34 function hiddenAd(){
35 //获取广告图片并设置其style属性的display值为none
36 document.getElementById("advertising").style.display= "none";
37 //清除隐藏广告图片的定时操作
38 clearInterval(time);
39 }
40 </script>
41 </head>
42 <body onload="init()">
43 <div id="advertising" style="display:none;">
44 <img src="../img/3.jpg" id="img1" width="100%" >
45 </div>
46 <div >
47 <img src="../img/1.jpg" id="imgid" width="50%" >
48 </div>
49 </body>
50 </html>
原文地址：https://www.cnblogs.com/breezezqf/p/9228577.html
时间： 2024-12-18 03:04:14