css3转换而不是.animate（）

Question

有没有办法在jQuery中使用css3过渡而不是使用.animate（）？

所以代替这段代码

jQuery('#pageHolder').stop().animate({
            left: 950

}, 400, function() {
            calcNav(pageSize);
            calcPage(pageSize);
});

可以，我将如何使用css过渡？

Answer 1

尝试

#pageHolder{
    -webkit-transition:left 0.4s;
    -moz-transition:left 0.4s;
    -o-transition:left 0.4s;
    transition:left 0.4s;
}

将处理程序附加到转换结束事件

jQuery('#pageHolder').on('webkitTransitionEnd transitionend msTransitionEnd oTransitionEnd', 
    function(){
        calcNav(pageSize);
        calcPage(pageSize);
    }
);

更改css属性以触发事件

jQuery('#pageHolder').css({left: 950});