slide recursively over child elements

by Rahul

HTML

<input id="b1"style="background-color:lightgray;"type="button"value="START"/>
  <input id="b2" style="background-color:lightgray;" type="button" value="STOP"/>
<div id="m1">
   
    <div id="n1">
        <div class="left">This is one</div>
        <div class="right"> this is one after</div>
    </div>
     <div id="n2">
        <div class="left">This is two</div>
        <div class="right"> this is two after</div>
    </div>
     <div id="n3">
        <div class="left">This is three</div>
        <div class="right"> this is three after</div>
    </div>
</div>

CSS

#m1{
    position:absolute;
    left:2%;
    top:10%;
    border:green 1px solid;
    height:80%;
    width:80%;
}
#n1,#n2,#n3{position:absolute;
            left:0px;
            top:0px;
            height:100%;
            width:100%;
            border:1px red solid;
          
}
.left{
    position:absolute;
    left:10%;
    top:10%;
}
.right{
    position:absolute;
    bottom:10%;
    right:10%;
}
.hide{display:none;}
#n1{background:url('http://fc06.deviantart.net/fs71/i/2010/224/b/d/Cartoon_Citroen_2CV_by_JimmyCartoonist.jpg') no-repeat scroll center center;
}
#n2{background:url('http://fc06.deviantart.net/fs71/i/2011/327/e/5/winnie_and_woody_by_jimmycartoonist-d4h2pfy.jpg') no-repeat scroll center center;
display:none;}
#n3{background:url('http://www.wickedartzshop.com/ekmps/shops/wickedartz/images/wp650.jpg') no-repeat scroll center center;
display:none;}

JavaScript

$("#b1").click(st);
$("#b2").click(ddd);
var $q=$([]);
function ddd(){
    $("#m1 div").stop(true, false);
}
function st(){
 var $m=$("#m1");
    $m.children().each(function(i,val){
        //console.log($(val));
      $q.queue('myq',function(){
          $(val).show().fadeIn(100);
        
      });
        $q.dequeue('myq');
      $q.queue('myq',function(){
          $(val).children(":first-child").animate({left:'50%'},2000);
          
      });
        $q.dequeue('myq');
    $q.queue('myq',function(){      
        $(val).children(":nth-child(2)").animate({right:'50%'},2000);
 
    });
    $q.dequeue('myq');
        $q.queue('myq',function(){  
        $(val).fadeOut(3000);
        $(val).children(":first-child").css({left:'10%'});
        $(val).children(":nth-child(2)").css({right:'10%'});
        
    });
        $q.dequeue('myq');
    });
}