杨老师课堂之JavaScript案例之自动切换轮播图片
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/kese7952/article/details/79905203 JavaScript案例之自动切换轮播图片 效果图: 思路: 1.先做界面 1.1制作按钮及点击触发事件 1.2引入一张图片 2.书写Css 2.1跳转div盒子的布局(宽、高、边框线、水平居中、文字居中...) 3.JavaScript 3.1定义“初始化”函数, 设置定时器 时间为3000毫秒 3.2定义一个变量 i 即原图的数字名称 3.3定义函数:将变量i进行自增。 3.4通过id获取图片元素所在位置,并在后面输出图片路径及图片名称i 的变量 3.5判断:当图片到达最后一张,将图片变量重置为0,进行循环递加到原图的图片名称1上去 参考代码: Html代码 <body onload="init()"> <div "> <input type="button" value="手动切换" onclick="changeImg()" /> <...