使用JS完成首页定时弹出图片

最新推荐文章于 2020-03-02 20:42:51 发布

酷爱WAF哈狗帮

最新推荐文章于 2020-03-02 20:42:51 发布

阅读量322

点赞数

分类专栏： JavaWeb前端

本文链接：https://blog.csdn.net/HuashirenYty/article/details/102696338

版权

JavaWeb前端专栏收录该内容

29 篇文章 0 订阅

订阅专栏

<script type="text/javascript">
		function init() {
			//书写轮图片显示的定时操作
			setInterval("changeImg()",3000);
			
			//设置显示广告图片的定时操作
			var time = setInterval("showAd()",3000);
		}
		
		//书写函数
		var i=0;
		function changeImg() {
			i++;
			document.getElementById("img1").src="../img/"+i+".jpg";
			if(i==3) {
				i=1;
			}
		}
		
		//书写显示广告图片的函数
		function showAd() {
			//获取广告图片的位置
			var adEle = document.getElementById("img2");
			//修改广告图片元素里面的属性让其显示
			adEle.style.display = "block";
			//清除显示图片的定时操作
			clearInterval(time);
			//设置隐藏图片的定时操作
			var time = setInterval("hiddenAd()",3000);
		}
		
		//书写隐藏广告图片的函数
		function hiddenAd() {
			//获取广告图片并设置其style属性的display值为none
			document.getElementById("img2").style.display = "none";
			//清除隐藏广告图片的定时操作
			clearInterval(time);
		}
	</script>

<img id="img2" src="../img/197512569446.jpg" height="20%" style="display: none;" />

一、外部引入js方式

酷爱WAF哈狗帮

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
使用JS完成首页定时弹出图片

<script type="text/javascript"> function init() { //书写轮图片显示的定时操作 setInterval("changeImg()",3000); //设置显示广告图片的定时操作 var time = setInterval("showAd()",3000); } //书写函数 va...
复制链接

扫一扫