php的图片自动轮播的写法,js实现自动图片轮播代码

本文实例为大家分享了轮播的具体代码，自动轮播，居中显示，供大家参考，具体内容如下

#div1{

width: 192px;

height: 120px;

border: 1px solid gray;

margin: 0 auto;

position: relative;

overflow: hidden;

}

#div1 img{

position: absolute;

}

//获取页面元素

var div1 = document.getElementById('div1');

var div2 = document.getElementById('div2');

var imgs = div1.getElementsByTagName('img');

//初始化页面图片的位置

window.οnlοad=function(){

for(var i=0; i

imgs[i].style.left = i*192 +'px'

}

};

//轮播移动的函数

function imgMove(){

var b1 = false;

for(var i = 0; i < imgs.length; i++) {

imgs[i].style.left = imgs[i].offsetLeft-1 + 'px';

if(imgs[i].offsetLeft==0){

b1=true;

if(i==0)

imgs[imgs.length-1].style='576px';

else

imgs[i-1].style.left='576px'

}

}

if(!b1)

setTimeout(imgMove,20);

else

setTimeout(imgMove,2000);

}

setTimeout(imgMove,3000);

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！