欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

Javascript实现滚动图片新闻的实例代码_javascript技巧

程序员文章站 2024-01-12 20:15:22
...
下面这段代码是用来实现图片新闻的
复制代码 代码如下:

var index = 0;
var Timer = null;

function initGallery(){
for(var i=0; i document.getElementById("fPic"+i).style.display = "none";
document.getElementById("fTitl"+i).style.display = "none";
document.getElementById("fNum"+i).style.className = "numOff";
}
startChange();
setTimer();
}

function startChange(){
index = index % 4;

changePic(index);
changeTitl(index);
changeNum(index);

index++;
}

function changePic(index){
for(var i=0; i document.getElementById("fPic"+i).style.display = "none";
}
document.getElementById("fPic"+index).style.display = "block";
}

function changeTitl(index){
for(var i=0; i document.getElementById("fTitl"+i).style.display = "none";
}
document.getElementById("fTitl"+index).style.display = "block";
}

function changeNum(index){
for(var i=0; i document.getElementById("fNum"+i).className = "numOff";
}
document.getElementById("fNum"+index).className = "numOff numOn";
}

function clearTimer(){
this.clearInterval(Timer);
}

function setTimer(){
Timer = window.setInterval(startChange, 3000)
}

function setIndex(index){
this.index = index;
this.startChange();
}