js加css3实现动画问题。。

Question

第一个：：：：
function slideList(){
var downY = 0;
var step = 1/4;
var nowIndex = 0;
var nextorprevIndex = 0;
$li.on('touchstart',function(ev){
var touch = ev.originalEvent.changedTouches[0];
downY = touch.pageY;
nowIndex = $(this).index();

        $li.on('touchmove',function(ev){
            var touch = ev.originalEvent.changedTouches[0];

            $(this).siblings().hide();

            if( touch.pageY < downY ){  //↑
                nextorprevIndex = nowIndex == $li.length-1 ? 0 : nowIndex + 1;
                $li.eq(nextorprevIndex).css('transform','translate(0,'+(viewHeight + touch.pageY - downY)+'px)');
            }
            else if( touch.pageY > downY ){  
                nextorprevIndex = nowIndex == 0 ? $li.length-1 : nowIndex - 1;
                $li.eq(nextorprevIndex).css('transform','translate(0,'+(-viewHeight + touch.pageY - downY)+'px)');
            }

            $li.eq(nextorprevIndex).show().addClass('zIndex');
            $(this).css('transform','translate(0,'+(touch.pageY - downY)*step+'px) scale('+(1-Math.abs(touch.pageY - downY)/viewHeight*step)+')');

        });

        $li.on('touchend',function(ev){
            var touch = ev.originalEvent.changedTouches[0];
            if( touch.pageY < downY ){  
                $(this).css('transform','translate(0,'+(-viewHeight * step)+'px) scale('+(1-step)+')');
            }
            else if( touch.pageY > downY ){  
                $(this).css('transform','translate(0,'+(viewHeight * step)+'px) scale('+(1-step)+')');
            }
            $(this).css('transition','.3s');
            $li.eq(nextorprevIndex).css('transform','translate(0,0)');
            $li.eq(nextorprevIndex).css('transition','.3s');
        });

    });

    $li.on('transitionEnd webkitTransitionEnd',function(ev){
        resetFn();

    });

    function resetFn(){
        $li.css('transition','');
        $li.eq(nextorprevIndex).removeClass('zIndex').siblings().hide();
    }

}
第二个；；：：
function slideList(){
    var downY=0;
    var step=1/4;
    var nowIndex=0;
    var nextIndex=0;

    $li.on('touchstart',function(ev){
        var touch = ev.originalEvent.changedTouches[0];
        nowIndex=$(this).index();
        downY=touch.pageY;
        $li.on('touchmove',function(ev){
            var touch = ev.originalEvent.changedTouches[0];
                $(this).siblings().hide();
                if(downY>touch.pageY){
                    nextIndex= nowIndex == $li.length-1 ? 0 : nowIndex+1;
                    $li.eq(nextIndex).css('transform','translate(0,'+(viewHeight + touch.pageY - downY)+'px');
                }else if(downY<touch.pageY){
                    nextIndex=nowIndex==0 ? $li.length-1 : nowIndex-1;
                    $li.eq(nextIndex).css('transform','translate(0,'+(-viewHeight+touch.pageY-downY)+'px');
                }
                $li.eq(nextIndex).show().addClass("zIndex");
                $(this).css('transform','translate(0,'+(touch.pageY-downY)*step+'px) scale('+(1-Math.abs(touch.pageY-downY)/viewHeight*step)+')');
        })

        $li.on('touchend',function(ev){
            var touch = ev.originalEvent.changedTouches[0];
                if(downY>touch.pageY){
                    $(this).css('transform','translate(0,'+(-viewHeight*step)+'px) scale('+(1-step)+')');
                }else if(downY<touch.pageY){
                    $(this).css('transform','translate(0,'+(viewHeight*step)+'px) scale('+(1-step)+')');
                }
                $(this).css('transition','0.3s');
                $li.eq(nextIndex).css('transform','translate(0,0)');
                $li.eq(nextIndex).css('transition','0.3s');
        })
    })
    $li.on('transitionEnd webkitTransitionEnd',function(ev){
            reswtFn();
        })
    function reswtFn(){
        $li.css('transition','');
        $li.eq(nextIndex).removeClass('zIndex').siblings().hide();
    }

}
效果为什么第二个不行？？？？？？？？第一个可以？？？？？？？、

Answer 1

大神在那里啊？？？？？？？？？
求救啊