jquery实现图片轮播器(2)

_now = index;
 //不管_now还是_now2都要和点击时index同步;
 //index可能在点击鼠标之后变成3,;松开鼠标后我们希望_now变成从3变成0,但是因为setInterval之后_now加1,_now其实还是从0变成1;所以需要同步_now和index;

2、计数器

_now2的作用是防止父元素在第一张留出空白图片;数字定时器和图片运动控制定时器是不同步的

var _now = 0;//这个控制数字样式的计数器 var _now2 = 0;//这个是控制图片运动距离的计数器

3、去relative属性

if (_now==0) { ali.eq(0).css('position','static');//去relative属性 oul.css('left',0);//当去完relative之后,要还原ul的“left”值为0; _now2=0;

4、去属性的时机

Oul.animate({css属性的设置},500,function())其中function就是在500ms执行完之后的操作;

oul.animate({'left':-aliWidth*_now2},500,function(){ //图片的移动,行元素的左侧距离wrap的左侧-500*now2 //根据一组css执行属性动画 if (_now==0) { ali.eq(0).css('position','static'); oul.css('left',0); _now2=0; //当_now为0的时候,_now2也应该还原回去为0; } });

*难点

首先,要学会获取元素值;
其次,了解几种函数;
再则,变量的灵活使用,达到了解变量每时每刻的值;
最后,定时器的控制是最难的;

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wyszjz.html