slide逻辑

//一个简单的slide 逻辑:var len = $(‘.huge-benefit-09 ul li‘).length;
                    var oLiWidth = $(‘.huge-benefit-09 ul li‘).css(‘width‘); //需要显示的宽度

                    for(var i=1; i<len; i++){
                        $(‘.huge-benefit-09 ul li‘).eq(i).css(‘left‘,parseInt(oLiWidth));
                    }  //初始其他li的位置
                    var iNow = 0; //当前li的下标
                    var onOff = true;  //预留开关功能。。。其实并无卵用
                    $(‘.arrow_left‘).click(function(){  //点击，左滑动
                        if(onOff){
                            onOffChange();
                            if(iNow>=len-1){
                                $(‘.huge-benefit-09 ul li‘).eq(iNow).animate({left:-parseInt(oLiWidth)},1000,moveRight); //归右
                                iNow = 0;

                            }
                            else{
                                $(‘.huge-benefit-09 ul li‘).eq(iNow).animate({left:-parseInt(oLiWidth)},1000);
                                iNow++;
                            }
                            $(‘.huge-benefit-09 ul li‘).eq(iNow).css(‘left‘,parseInt(oLiWidth));
                            $(‘.huge-benefit-09 ul li‘).eq(iNow).animate({left:0},1000,onOffChange);
                        }
                    })
                    $(‘.arrow_right‘).click(function(){ //点击，右滑动
                        if (onOff) {
                            onOffChange();
                            if(iNow<=0){
                                $(‘.huge-benefit-09 ul li‘).eq(iNow).animate({left:parseInt(oLiWidth)},1000,moveLeft);   //归左
                                iNow = len-1;

                            }
                            else{
                                $(‘.huge-benefit-09 ul li‘).eq(iNow).animate({left:parseInt(oLiWidth)},1000);
                                iNow--;
                            }
                            $(‘.huge-benefit-09 ul li‘).eq(iNow).css(‘left‘,-parseInt(oLiWidth));
                            $(‘.huge-benefit-09 ul li‘).eq(iNow).animate({left:0},1000,onOffChange); //显示
                        };
                    })
                    function moveRight(){
                        for(var j=1;j<len;j++){
                            $(‘.huge-benefit-09 ul li‘).eq(j).css(‘left‘,parseInt(oLiWidth));
                        }
                    }
                    function moveLeft(){
                        for(var j=0;j<len-1;j++){
                            $(‘.huge-benefit-09 ul li‘).eq(j).css(‘left‘,-parseInt(oLiWidth));
                        }
                    }
                    function onOffChange(){
                        onOff = !onOff;
                    }
                    $(‘.huge-benefit-08 .zt-con a‘).click(function(){
                        if($(this).index()==iNow)
                            return;
                        else if($(this).index()<iNow){
                            $(‘.huge-benefit-09 ul li‘).eq(iNow).animate({left:parseInt(oLiWidth)},1000);
                            $(‘.huge-benefit-09 ul li‘).eq($(this).index()).css(‘left‘,-parseInt(oLiWidth));
                        }
                        else{
                            $(‘.huge-benefit-09 ul li‘).eq(iNow).animate({left:-parseInt(oLiWidth)},1000)
                            $(‘.huge-benefit-09 ul li‘).eq($(this).index()).css(‘left‘,parseInt(oLiWidth));

                        }
                        iNow = $(this).index();
                        $(‘.huge-benefit-09 ul li‘).eq($(this).index()).animate({left:0},1000)
                    })    

注释:一个简单slide的逻辑:

1.获取li的个数，和显示区域的宽度

2.moveLeft,moveRight 两种临界归左，归右

3.点击进行时的两个li的动作，和当前iNow下标的判断；