Javascript實現(xiàn)滾動圖片新聞的實例代碼
下面這段代碼是用來實現(xiàn)圖片新聞的
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();
}
相關(guān)文章
在前端程序開發(fā)中，經(jīng)常會實現(xiàn)js輪播圖的效果，怎么實現(xiàn)的呢？下面小編給大家分享基于基于JavaScript實現(xiàn)輪播圖代碼 ，非常不錯，感興趣的朋友可以參考下2016-07-07
這篇文章主要介紹了JavaScript對Cookie進行讀寫操作的方法,實例分析了javascript針對cookie的讀寫操作技巧,非常簡單實用,需要的朋友可以參考下2015-07-07
js調(diào)試工具console.log()方法查看js代碼的執(zhí)行情況
以往都是使用alert的方式查看js代碼的執(zhí)行情況，今天看到有朋友使用console.log函數(shù)打印輸出函數(shù),變量,對象,下邊就console.log的使用情況進行記錄2014-08-08
js樹插件zTree獲取所有選中節(jié)點數(shù)據(jù)的方法
這篇文章主要介紹了js樹插件zTree獲取所有選中節(jié)點數(shù)據(jù)的方法,是對js樹插件zTree非常實用的操作,需要的朋友可以參考下2015-01-01
用Javascript判斷圖片大小，其實只要寫一個簡單的函數(shù)就可以了，使用其他語言進行判斷，過程比較復(fù)雜，用 Javascript 判斷輕松搞定2014-11-11
JavaScript HTML DOM 元素 (節(jié)點)新增，編輯，刪除操作實例分析
這篇文章主要介紹了JavaScript HTML DOM 元素 (節(jié)點)新增，編輯，刪除操作,結(jié)合實例形式分析了JavaScript針對HTML DOM 元素 (節(jié)點)的新增，編輯，刪除相關(guān)操作技巧與使用注意事項,需要的朋友可以參考下2020-03-03
JavaScript獲取鼠標坐標的函數(shù)（兼容IE、FireFox、Chrome）
下午想做個鼠標跟隨的JS腳本，發(fā)現(xiàn)瀏覽器兼容問題還真是煩人，還有滾動條位置的問題。2010-01-01
這篇文章主要為大家詳細介紹了js獲取數(shù)組中的最大值的9種方法，以及每種方法的工作原理和用法，文中的示例代碼講解詳細，需要的可以參考下2023-08-08
這篇文章主要給大家介紹了關(guān)于express異步函數(shù)異常捕獲的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11
javascript數(shù)組includes、reduce的基本使用
這篇文章主要給大家介紹了關(guān)于javascript數(shù)組includes、reduce的基本使用方法,includes方法是用于檢查特定元素是包含在數(shù)組還是字符串中的方法,而reduce用法則有很多,需要的朋友可以參考下2021-07-07