刚刚试了一下，发现如果将 $('ul').css('left', '1400px') 放在前面两个都生效。
反过来就不行了！！！不太懂！

因为实际上它的执行顺序是：
$('ul').css('left', '1400px')

$('ul').css('left', '300px')

但第一步瞬间完成，接下来开始动画效果的第二步，所以给你的感觉是第一步失效了。

动画的执行会有时间，下面的设置并没有失效，而是被动画的效果覆盖了。如果你仔细观察，会发现，在动画的过程中，left突然变了很大，然后又变回来。如果想在动画完成后，实现一些操作，可以发在回调里。

 $('.next').click(function () {
    $('ul').animate({
        'left':'300px'
    },function(){
        $('ul').css('left', '400px')
    })
});