javascript zIndex
 

Ребята помогите!

<script type="text/javascript">
                var path = './img/images/';
                var images = new Array('001.png', '002.png', '003.jpg', '004.jpg', '005.jpg', '006.png', '007.jpg', '008.jpg', '009.png');
                var pic_old="./img/images/"+images[Math.floor(Math.random()*images.length)];
                var pic="./img/images/"+images[Math.floor(Math.random()*images.length)];
                function show_one(){
                 one=$('.pic').get(0);
                 two=$('.pic2').get(0);
                $(one).fadeOut('slow', function(){
                                        $(one).css('zIndex', 1);
                                        $(two).css('zIndex', 2);

                                        $(two).attr('src', pic_old);
                                        pic_old = "./img/images/"+images[Math.floor(Math.random()*images.length)];
                                        $(two).fadeOut('slow', function(){
                                            $(two).css('zIndex', 1);
                                            $(one).css('zIndex', 2);
                                            $(one).attr('src', pic);
                                            pic = "./img/images/"+images[Math.floor(Math.random()*images.length)];
                                        });
                 }); 
                 setTimeout('show_one()',2500);
                }
                            
        </script>

<div class="img">
             <img style="position:absolute; opacity: 1; z-index: 2;"  src="./img/images/001.png" class="pic"  />
             <img style="position:absolute; opacity: 0; z-index: 1;"  src="./img/images/002.png" class="pic2"  />
             
             <script>show_one();</script>

            
         </div>

Картинка должна исчезать! А за ней уже загрузилась 2 картинка! Где ошибка почему криво работает?