jQuery animate elements while animating element they are contained in

i got div which contain 2 other divs, while i fade in outer div on page load i'd like to animate first inner div to slide in right and second inner div to slide in left, i know how do these things separately but i don't know how to put these things 开发者_如何学Cyo work smiulatanously together

thanks for any help

---

EDIT:

the html:

<div id="wrapper">
    <div id="left">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    </div>
    <div id="right">
         <p>Suspendisse nunc lorem, malesuada sit amet hendrerit at, vulputate non quam. </p>
    </div>
</div>

css:

<style type="text/css" media="all">
    #wrapper{
        position: relative;
        width: 500px;
        height: 500px;
        overflow: hidden;
        display: none;
        background: silver;
    }
    #left, #right{
        position: absolute;
        width: 50%;
        height: 100%;
    }
    #left{
        background: yellow;
        left: -50%;
    }
    #right{
        background: red;
        right: -50%;
    }
</style>

I used a simple screen representation, where div#wrapper is just a box with specified width and height, overflow set to hidden (so the animated elements don't get shown, when they are out of boundaries) and two divs, with ids of #left and #right, each has absolute position, width 50%, #left is moved -50% to the left and #right is moved -50% to the right;

first revision considering JS/jQuery:

the trick is not to use chaining, but to write the code independently of other animations (e.g. not using the anonymous callback - onAnimationEnd)

<script type="text/javascript">
$(function(){
    var animTime = 2000;
    $("#wrapper").fadeIn(animTime);
    var $lefty = $("#left");
    $lefty.animate({
      left: parseInt($lefty.css('left'),10) == 0 ?
        -$lefty.outerWidth() : 0
    }, animTime);
    var $righty = $("#right");
    $righty.animate({
      right: parseInt($righty.css('right'),10) == 0 ?
        -$righty.outerWidth() : 0
    }, animTime); 
});    
</script>

the left and right animation scripts took from: http://www.learningjquery.com/2009/02/slide-elements-in-different-directions

regards.