使用JS完成首页轮播效果

setInterval和setTimeout

setTimeout()方法只运行一次,也就是说当达到设定的时间后就出发运行指定的代码,运行完后就结束了,如果还想再次执行同样的函数,可以在函数体内再次调用setTimeout(),可以达到循环调用的效果。

setInterval()是循环执行的,即每达到指定的时间间隔就执行相应的函数或者表达式,是真正的定时器。


    function init(){
        //书写轮播图片显示的定时操作
        setInterval("changeImg()",1000);;
    }

    //书写函数
    var i=0;
    function changeImg(){
        i++;
        //获取图片位置并设置src属性值
        document.getElementById("img1").src="../img/"+i+".jpg";
        if(i==3){
            i=0;
        }
    }

源代码: 



	
		
		首页
		
		
	
	
		
    最新商品   

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

    热门商品   

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

电炖锅

¥399

 

你可能感兴趣的:(JS)