Web前端——实现轮播图

还有一棵西兰花

已于 2024-03-18 10:20:17 修改

阅读量5.7k

点赞数 5

分类专栏：对代码和系统的学习_小白入门

于 2021-11-12 15:35:08 首次发布

本文链接：https://blog.csdn.net/weixin_44831983/article/details/121289166

版权

前端 javascript html

对代码和系统的学习_小白入门专栏收录该内容

3 篇文章 0 订阅

订阅专栏

小白总结一下最近学到的前端知识，实现轮播图~~
分两步：
第一步：在body中添加οnlοad=”show()”，onload事件是浏览器解析完页面之后就会自动触发的事件

<body onload=”show()”></body>

第二步：在head中添加js事件

<head>
<script>
	var start=1;
	function show(){
		//for循环轮播4张图片，显示出一张图片，其他三张图片隐藏起来
		for(var i=1;i<=4;i++){
			if(i==start){
				document.getElementById().style.display=”block”;//display中none：隐藏，block:显示
			}else{
				document.getElementById().style.display=”none”;
			}
		}
		//显示完第一张图片后，调整start的值为2，准备显示第二张
		if(start==4){
			start=1；
		}else{
			start++;
		}
		**setTimeout(“show()”,1000);**//setTimeout()方法用于在指定的毫秒数后调用函数，这里为每1秒调用show()
	}
</script>
</head>

还有一棵西兰花

关注

5
点赞
踩
39

收藏

觉得还不错? 一键收藏
打赏
0
评论
Web前端——实现轮播图

小白总结一下最近学到的前端知识，实现轮播图~~分两步：第一步：在body中添加οnlοad=”show()”，onload事件是浏览器解析完页面之后就会自动触发的事件<body onload=”show()”></body>第二步：在head中添加js事件<head><script> var start=1; function show(){ //for循环轮播4张图片，显示出一张图片，其他三张图片隐藏起来 for(var i=1;i&
复制链接

扫一扫