轮播图:
函数绑定在body标签内
采用3张图,1.jpg 2.jpg 3.jpg 利用定时任务执行设置图片属性 src 利用for循环可以完成3秒一次 一替换。
定时弹出广告:
由于body标签已经绑定了函数
所以直接用 window 加载事件 函数
广告图片的默认display属性是none
3秒后将广告图片的 display属性 设置成block 就可以形成3秒后显示广告图片
弹出后 需要清理定时
然后在写一个3秒定时 隐藏的函数 ,最后也要清理定时。
<script> function init(){ //书写轮播图显示的定时操作 setInterval("changeImage()",3000); //设置显示广告图片的定时操作 time =setInterval("showAd()",3000) } //书写函数 var i=0 function changeImage(){ i++; //获取图片位置并设置src属性值 document.getElementById("img1").src="../img/"+i+".jpg"; if(i==3){ i=0; } } //2.书写显示广告图片的函数 function showAd(){ //3.获取广告图片的位置 var adEle=document.getElementById("img2"); //4.修改广告图片元素里面的属性让其显示 adEle.style.display="block"; //5.清楚显示图片的定时操作 clearInterval(time); //6.设置隐藏图片的定时操作 time1= setInterval("hiddenAd()",3000); } //7.书写隐藏广告图片的函数 function hiddenAd(){ //8.获取广告图片并设置其style属性的display值为nono document.getElementById("img2").style.display="none"; clearInterval(time1) } </script>
原文地址:https://www.cnblogs.com/benjamin77/p/9159801.html
时间: 2024-10-20 10:58:47