在这一串代码中,假设var n=0;当n=0时,是1.jpg还是5.jpg?
<body>
<div id="banner">
<div id="pic">
<ul>
<li><img src="img/5.jpg" alt="" /></li>
<li><img src="img/1.jpg" alt="" /></li>
<li><img src="img/2.jpg" alt="" /></li>
<li><img src="img/3.jpg" alt="" /></li>
<li><img src="img/4.jpg" alt="" /></li>
<li><img src="img/5.jpg" alt="" /></li>
<li><img src="img/1.jpg" alt="" /></li>
</ul>
</div>
<div id="btn">
<div id="left"><</div>
<div id="right">></div>
</div>
<div id="tab">
<ul>
<li class='on'></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
<script type="text/javascript" src='move.js'></script>
<script type="text/javascript">
(function(){
var tabLi = document.getElementById('tab').getElementsByTagName('li');
var oUl = document.getElementById('pic').getElementsByTagName('ul')[0];
var oRight = document.getElementById('right');
var oLeft = document.getElementById('left');
var oBanner = document.getElementById('banner');
var ligoudaner = 0;
var timer;
var nowTime = 0;
for ( var i=0;i<tabLi.length;i++ )
{
tabLi[i].wangdachui = i;
tabLi[i].onclick = function(){
tabLi[ligoudaner].className = ''; // 前一个变到没有
ligoudaner = this.wangdachui;
change();
};
};
oRight.onclick = function(){
if ( new Date() - nowTime > 300 )
{
nowTime = new Date();
tabLi[ligoudaner].className = '';
ligoudaner ++;
ligoudaner %= tabLi.length+1;
change();
}
};
oLeft.onclick = function(){
if ( new Date() - nowTime > 300 )
{
nowTime = new Date();
tabLi[ligoudaner].className = '';
ligoudaner = ligoudaner<0?tabLi.length-1:ligoudaner-1;
change();
};
};
auto();
oBanner.onmouseenter = function(){
clearInterval( timer );
};
oBanner.onmouseleave = function(){
auto();
};
function auto(){
timer = setInterval(function(){
tabLi[ligoudaner].className = '';
ligoudaner ++;
ligoudaner %= tabLi.length+1;
change();
},3000);
};
function change(){
var now = ligoudaner;
now %= tabLi.length;
if ( now < 0 )now = tabLi.length - 1;
tabLi[now].className = 'on'; // 当前这个加上on
move( oUl , {marginLeft : -520*(ligoudaner+1) + 'px'} , 300 , function(){
if ( ligoudaner == tabLi.length )
{
this.style.marginLeft = '-520px';
ligoudaner = now;
}
else if (ligoudaner == -1)
{
this.style.marginLeft = -520*tabLi.length + 'px';
ligoudaner = now;
}
});
};
})();