<div class="fan">
<div class="container" id="idTransformView2">
<ul class="slider slider2" id="idSlider2">
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
</ul>
<ul class="num" id="idNum2">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</div>
</div>$(function(){
var len2 = $("#idNum2 > li").length;
alert(len2);
var index2 = 0;
showImg2(index2);
$("#idNum2 li").mouseover(function(){
index2 = $("#idNum2 li").index(this);
showImg2(index2);
});
//滑入 停止动画,滑出开始动画.
$('#idTransformView2').hover(function(){
if(MyTime2){
clearInterval(MyTime2);
}
},function(){
MyTime2 = setInterval(function(){
showImg2(index2);
index2++;
if(index2==len2){index2=0;}
} , 3000);
});
//自动开始
var MyTime2 = setInterval(function(){
showImg2(index2);
index2++;
if(index2==len2){index2=0;}
} , 3000);
})
// Demo2 : 关键函数:通过控制left ,来显示不通的幻灯片
function showImg2(i){
$("#idSlider2").stop(true,false).animate({left : -422*i},800);
$("#idNum2 li")
.eq(i).addClass("on")
.siblings().removeClass("on");
}为什么走到第五章图片的时候是空白呢???
<div class="container" id="idTransformView2">
<ul class="slider slider2" id="idSlider2">
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
<li>
<img src="Skin/temp/tu_2.jpg" /></li>
</ul>
<ul class="num" id="idNum2">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</div>
</div>$(function(){
var len2 = $("#idNum2 > li").length;
alert(len2);
var index2 = 0;
showImg2(index2);
$("#idNum2 li").mouseover(function(){
index2 = $("#idNum2 li").index(this);
showImg2(index2);
});
//滑入 停止动画,滑出开始动画.
$('#idTransformView2').hover(function(){
if(MyTime2){
clearInterval(MyTime2);
}
},function(){
MyTime2 = setInterval(function(){
showImg2(index2);
index2++;
if(index2==len2){index2=0;}
} , 3000);
});
//自动开始
var MyTime2 = setInterval(function(){
showImg2(index2);
index2++;
if(index2==len2){index2=0;}
} , 3000);
})
// Demo2 : 关键函数:通过控制left ,来显示不通的幻灯片
function showImg2(i){
$("#idSlider2").stop(true,false).animate({left : -422*i},800);
$("#idNum2 li")
.eq(i).addClass("on")
.siblings().removeClass("on");
}为什么走到第五章图片的时候是空白呢???
应该是多算了一个。注意序号从0开始还是从1开始,你自己进行分析