也许这样可能会帮助你： http://jsfiddle.net/eJk3R/38/

Maybe something like this could help you : http://jsfiddle.net/eJk3R/38/

$(document).ready(function(){
    $('.move-up').click(function(){
        if ($(this).prev()){
            var t = $(this);
            t.parent().animate({top: '-20px'}, 500, function(){
                t.parent().prev().animate({top: '20px'}, 500, function(){
                    t.parent().css('top', '0px');
                    t.parent().prev().css('top', '0px');
                    t.parent().insertBefore(t.parent().prev());
                });
            });
        }
    });
    $('.move-down').click(function(){
        if ($(this).next()){
            var t = $(this);
            t.parent().animate({top: '20px'}, 500, function(){
                t.parent().next().animate({top: '-20px'}, 500, function(){
                    t.parent().css('top', '0px');
                    t.parent().next().css('top', '0px');
                    t.parent().insertAfter(t.parent().next());
                });
            });
        }
    });
});

这不是完美的，你需要清理代码一点，

It's far from perfect, you'll need to clean up the code a little bit and test the presence of an element before and after a little better before fireing the animation.

我还添加了 position：relative; 到一个元素之前和之后 span 样式。

I also added position: relative; to the span style.