在移动端做一个页面滑动时transition失效

Question

我要一个div滑动时判断滑动距离超过一个值则translateY（-100%），否则translateY（0%），可是在手机浏览器里translateY（0%）的动画是3S内缓慢执行的，而translateY（-100%）则是瞬间完成的，请问这是什么问题？
在谷歌手机模拟器上运行是正常的

"touchmove":function(e){
            moveY=e.originalEvent.targetTouches[0].pageY;
            // console.log(startY+".."+moveY);
            if(flag1){
                if(startY>moveY){
                    e.preventDefault();
                    $(".d_content2").css({
                        "-webkit-transition":"none",
                        "-webkit-transform":"translateY("+(moveY-startY)+"px)"
                    })  
                }
            }
        },
        "touchend":function(e){
            endY=e.originalEvent.changedTouches[0].pageY; 
            if(flag1){
                if(startY-endY>=100){
                    $(".d_content2").css({
                        "-webkit-transition":"-webkit-transform 3s linear",
                        "-webkit-transform":"translateY(-100%)"
                    });
                }else{
                    $(".d_content2").css({
                        "-webkit-transition":"-webkit-transform 3s linear",
                        "-webkit-transform":"translateY(0)"
                    })  
                }
            }
        } 

Answer 1

不能用-100%；需要用具体的数值

Answer 2

我也碰到了类似的问题，在手机上第一张照片有效果，而其他照片在end事件结束后都是瞬间移动。请问最后这个问题解决了吗？