思路:
1.點(diǎn)擊按鈕宫仗,改變顯示的圖片够挂。同時(shí)改變對(duì)應(yīng)小圓點(diǎn)的顏色。
2.點(diǎn)擊小圓點(diǎn)藕夫,改變小圓點(diǎn)顏色孽糖,顯示對(duì)應(yīng)的圖片枯冈。
3.鼠標(biāo)移入圖片內(nèi),輪播圖停止办悟,鼠標(biāo)移出則恢復(fù)尘奏。
難點(diǎn):
1.快速點(diǎn)擊按鈕,如何實(shí)現(xiàn)圖片播放完成后在進(jìn)行下一張圖片的播放(解決方法:函數(shù)截流病蛉。判斷該圖片是否正在播放炫加,如果為真則停止后續(xù)函數(shù)的執(zhí)行。如:if (imgLi[a].isaimate) return)铺然。
2.如何實(shí)現(xiàn)圖片自動(dòng)播放時(shí)時(shí)俗孝,小圓點(diǎn)同步改變(解決方法:排他模型)。
個(gè)人容易忘記的地方魄健。
for (i = 0; i < circlesLi.length; i++)
{
###一定要記得先編號(hào)8陈痢!沽瘦!
circlesLi[i].index = i;
circlesLi[i].onclick = function(){
if (imgLi[a].isaimate) return;
animate(imgLi[a], {"opacity": 0}, 700)
a = this.index;
animate(imgLi[a], {"opacity": 1}, 700)
changeCircles();
}
}