网站首页 网站建设 IT知识 IT知识教程 Javascript实现滚动图片新闻的实例代码

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

2021-05-26 21:25:37

下面这段代码是用来实现图片新闻的
复制代码 代码如下:
var index = 0;
var Timer = null;

function initGallery(){
for(var i=0; i< 4; 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<4;i++){
document.getElementById("fPic"+i).style.display = "none";
}
document.getElementById("fPic"+index).style.display = "block";
}

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

function changeNum(index){
for(var i=0; i<4; 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();
}

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。 如涉及版权问题,请提交至online#300.cn邮箱联系删除。

以上产品还未完全满足我的所有需求,在下方提交我的专属需求
我的专属需求:
*手机号:
*验证码:
img
咨询报价
现在咨询
img

在线咨询

建站在线咨询

img

微信咨询

扫一扫添加
动力姐姐微信

img
img

TOP