如何调整这两个效果的次序？

首先我不懂JS，可能问的问题很幼稚，代码是我通过查找一遍遍改出来的。
下面的图片是我想要解决的问题。底部涂黑的一行是一个div，里面用Jquery实现了一个图片展示的效果，右下角是一个打开网页时出现的一个小的信息框。
基本效果我实现了，不过我不知道在哪可以调成两个效果的次序，我的信息框在图片展示效果的下面了，如何能使信息框到上面？
找了半天也没找到类似的问题......，哪有有时间帮下忙吧，在线等，要什么说话我传上来。
<script type="text/javascript" src="include/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
<!--
            $(document).ready(function(){
                $('.boxgrid.slidedown').hover(function(){
                    $(".cover", this).stop().animate({top:'-260px'},{queue:false,duration:200});
                }, function() {
                    $(".cover", this).stop().animate({top:'0px'},{queue:false,duration:100});
                });
                //Caption Sliding (Partially Hidden to Visible)
                $('.boxgrid.caption').hover(function(){
                    $(".cover", this).stop().animate({top:'160px'},{queue:false,duration:100});
                }, function() {
                    $(".cover", this).stop().animate({top:'220px'},{queue:false,duration:100});
                });
            });
-->
</script>
这段代码是jquery的代码
下面是信息框代码：<script type="text/javascript" src="include/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(function(){
    $('#investor').slideDown();
    
    $(window).scroll(function(){
        $("#investor").css({"bottom":"0px"});
        $("#investor").css({"right":"0px","bottom":"1px"});
    }).resize(function(){
            $('#investor').css({'bottom':'1px','right':'0'});
    });
    
    $('#ibody').html('<p>信息框内容...</p><a href="javascript:;" onclick="$(\'#investor\').slideUp();return ShowPage(\'d.htm\',\'\',960,870);">More...</a>');
    
    $('#close').hover(function(){
        $(this).css('background-position','right bottom');
    },function(){
        $(this).css('background-position','left top')
    }).click(function(){
        $('#investor').slideUp();
    });
    setTimeout('$(\'#investor\').slideUp();',15000);
})
</script>