我的滑块在左键单击时无法正常工作

Question

我的滑块在右键单击时工作正常并在每次单击时显示两个元素，但在左键单击它会显示元素并执行动画但不正确。

这是我的jQuery：

$(document).ready(function(){
    $(".prev_button").click(function(){
        $("ul.slider").animate({
            left: "+=340"
        }, 3000, function(){
            $("ul.slider").css('left', '0');
            li_no = 0;
            $("ul.slider").find("li").each(function(){
                li_no = li_no + 1;
            });
            slide_after_this = li_no - 3;
            $('ul.slider li:gt('+slide_after_this+')').prependTo('ul.slider'); // << line changed
        });
    });

    $(".next_button").click(function(){
        //alert($("ul.slider").css("right"));
        $("ul.slider").animate({
            right: "+=340"
        }, 3000, function(){
        //alert($("ul.slider").css("right"));
            $("ul.slider").css('right', '0');
            $('ul.slider li:not(:nth-child(n+3))').appendTo('ul.slider');
        });
    });
});

我想知道我怎么能：

在左键单击动画的同时移动元素（就像右键单击一样）。

此链接显示滑块：

http://jsfiddle.net/q1Lqd8aj/