Javascript Jquery菜单，如何制作动画在后面从这个我做的

jQuery代码：

$(document).ready(function(){
    var abc='';
    $(".doa").on("click",function(){  
        var doa=$(this).val();
        var doah=$(this).position();
        abc=doah.top;
        var x=+doah.top-80;
        $(this).css({color:"red"});
        $(".doa").not(this).animate({opacity:"0",margin:"0 0 0 500"},400,function(){        
            $(this).css({display:"none"});
            $(".doa:contains('"+doa+"')").css({position:"absolute","top":doah.top}).animate({"top":50},function(){
                $(".doa:contains('"+doa+"')>.doaa").show(function(){
                    $(".doa").addClass("doa1").removeClass("doa");
                });
            });
            $(".naslov").css({position:"relative"}).animate({top:"300px",opacity:"0"},200);
        });
    });
)};

---

现在，我想让同样的动画反向工作。当在类

doa1

上单击时，我想要所有原始动画，但要向后。它应该首先隐藏

doa1>ul.doaa

，然后将class

naslov

和class

doa

隐藏回原来的位置，并且在class

doa1

重置到其原始位置后，它应该反转class

doa

的div的动画（全部从上到后）…我已经试过了，我得到了解决我的问题的答案…这是我正在寻找的解决方案：

var abc='';
$(".load").delegate(".doa","click",function(){
    var doa=$(this).val();
    var doah=$(this).position();
    abc=doah.top;
    var x=+doah.top-80;
    $(this).css({color:"red"});
    $(".doa").not(this).animate({opacity:"0",margin:"0 0 0 500"},300,function(){        
        //$(this).css({display:"none"});
        $(".doa:contains('"+doa+"')").css({position:"absolute","top":doah.top}).animate({"top":50},function(){
            $(".doa:contains('"+doa+"')>.doaa").show(function(){
                $(".doa:contains('"+doa+"')").toggleClass("doa doa1");
            });
        });
        $(".naslov").css({position:"relative"}).animate({top:"300px",opacity:"0"},200);
    });
});

$(".load").delegate(".doa1","click",function(e){
    var po=$(this).val();
    $(".doa1>.doaa").hide(function(){
        $(".doa1:contains('"+po+"')").css({position:"absolute",color:"black"}).animate({"top":abc},function(){
            $(".doa1").css({position:"static"}).animate({opacity:"1",margin:"0"},300).toggleClass("doa1 doa");          
        });
        $(".naslov").css({position:"relative"}).animate({top:"0",opacity:"1"},200);
    }); 
});