這個(gè)輪播圖的JS動(dòng)態(tài)代碼：
var currentNum = 0;
var changeBgOfObj = document.getElementById("Carousel-BgDiv");
var circleObjId = "circle";
var imgName = "";
var imgUrl = "";
//---------點(diǎn)擊廣告上的頁(yè)碼點(diǎn)換圖片-----------------
function changeBg(num){
// var changeBgOfObj = document.getElementById("Carousel-BgDiv");
currentNum = parseInt(num);
imgName = String(parseInt(num) + 10);
imgUrl = "url(img/" + imgName + ".png) no-repeat";
// alert(imgUrl);
changeBgOfObj.style.background = imgUrl;
//遍歷所有的小圓點(diǎn) 讓被點(diǎn)擊的小圓點(diǎn)背景變紅 其他的全都變黑
for (var i = 1; i <= 6; i++) {
circleObjId = String("circle" + i);
if(i == num){
document.getElementById(circleObjId).style.backgroundColor = "#DC143C";
}else{
document.getElementById(circleObjId).style.backgroundColor = "black";
}
}
}
//---------------點(diǎn)擊箭頭換圖片-----------------
function onclickChangeBg(id){
if(id == "Lbtn"){
if(currentNum == 1){
currentNum = 6;
}else{
currentNum = currentNum - 1;
// alert(currentNum);
}
}
if(id == "Bbtn"){
if(currentNum == 6){
currentNum = 1;
}else{
currentNum = currentNum + 1;
}
}
var StrCurrentNum = String(currentNum + 10);
var bgimageURL = "url(img/" + StrCurrentNum + ".png) no-repeat";
changeBgOfObj.style.background = bgimageURL;
for (var i = 1; i <= 6; i++) {
if(i != currentNum){
document.getElementById("circle"+i).style.backgroundColor = "black";
}else if(i == currentNum){
document.getElementById("circle"+i).style.backgroundColor = "#DC143C";
}
}
}
//定時(shí)器調(diào)用的方法，調(diào)用這個(gè)方法換圖片
function autoChangeBg(){
if(currentNum == 6){
currentNum = 1;
}else{
currentNum++;
}
//拼接圖片的名字
imgName = String(currentNum + 10);
//拼接圖片地址
imgUrl = "url(img/" + imgName + ".png) no-repeat"
//拿到要換圖片的對(duì)象
changeBgOfObj.style.background = imgUrl;
//遍歷所有小圓點(diǎn)讓當(dāng)前圖片對(duì)應(yīng)的小圓點(diǎn)變紅 其他的變黑
for (var i = 1; i<= 6;? i++) {
if(i == currentNum){
document.getElementById("circle"+i).style.backgroundColor = "#DC143C";
}else{
document.getElementById("circle"+i).style.backgroundColor = "black";
}
}
}
var play=setInterval("autoChangeBg()",1000);
通過(guò)點(diǎn)擊左右兩個(gè)灰色的按鈕來(lái)觸發(fā)onclickChangeBg(id)函數(shù)切換圖片。
