js換圖片效果可進行定時操作_javascript技巧

複製程式碼 程式碼如下:

字串路徑= request.getContextPath ();
String basePath = request.getScheme() "://" request.getServerName() ":" request.getServerPort() 路徑"/";
%>











;


* {
邊距：0px;
內邊距：0px;
}
li {
列表樣式：無；
}
img {
邊框：0;
}
a {
文字裝飾：無;
}
#slide {
寬度：800px;
高度：400px;
盒子陰影：0px 0px 5px #c1c1c1c1；
邊距：20px 自動；
位置：相對；
溢出：隱藏；
}
#slide ul {
位置：絕對；
左：0px;
上：0px；
高度：400px;
寬度：11930px;
}
#slide ul li {
寬度：800px；
高度：400px>；隱藏；
浮動：左；
}
#slide .ico {
寬度：800px;
高度：20px;
溢出：隱藏；
文字對齊：居中；
位置：絕對；
左：0px;
底部：10px;
z 索引：1;
}
#slide .ico a {
顯示：內聯塊;
寬度：10px;
高度：10px;
背景：url(out.png) 無重複0px 0px;
邊距：0px 5px；
}
#slide . ico .active {
背景：url(out1.png) no-repeat 0px 0px;
}
#btnLeft {
寬度：60px;
高度：400px；
寬度：60px;
高度：400px；
左： 0px;
上：0px;
背景：url() 無重複0px 0px;
位置：絕對；
z 索引：2;
}
#btnLeft :hover {tn
背景：url() no-repeat 0px 0px;
}
#btnRight {
寬度：60px;
高度：400px;
右：0px;
高度：400px;
右：0px;
頂部：0x ;
背景：url() 無重複0px 0px;
位置：絕對；
z 索引：2;
}
#btnRight :hover {
背景：url() no no -repeat 0px 0px;
}

樣式>


window.onload = function() {
var oIco = document.getElementById("ico");
var aBtn = oIco.getElementsByTagName("a");
var oSlide = document.getElementById("slide");
var oUlget =Slide. ("ul");
var aLi = oUl[0].getElementsByTagName("li");
var oBtnLeft = document.getElementById("btnLeft");
var oBtnRight = document.getElementBy(ument." btnRight");

var baseWidth = aLi[0].offsetWidth;
//alert(baseWidth);
oUl[0].style.width = baseWidth * aLi.length "px" ;
var iNow = 0;
for(var i=0;iaBtn[i].index = i;
aBtn[i].onclick = function() {
//alert(this.index);
//alert(oUl[0].style.left);
移動(this.index);
//aIco[ this.index].className = "active";
}
}
oBtnLeft.onclick = function() {
iNow ;
//document.title = iNow;
移動（iNow）；
}
oBtnRight.onclick = function() {
iNow --;
document.title = iNow;
移動（iNow）；
}
}

var curIndex = 0;
var 時間間隔= 1000;
setInterval(改變,時間間隔);
函數change() {
if(curIndex == aBtn.length) {
curIndex =0;
} else {
move(curIndex);
curIndex = 1;
}

}

}

}

}
//document.title = index;
if(index>aLi.length-1) {
index = 0;
iNow = 索引；
}
if(indexindex = aLi.length - 1;
iNow = 索引；
}
for(var n=0;naBtn[n ].className = "";
} aBtn[index].className = "active"; oUl[0].style.left = -index * baseWidth "px"; // buffer(oUl[0],{ // left:-index * baseWidth // },8) } }
腳本>
頭>

;

• 


• 


• 


• 

身體>