Question

I have a logo div parted by two spans, at the moment I am fading in the first and after that fading in the 2nd. Now I am experimenting to trigger three spans and would like to make three actions happen at the same time, fading in all three elements while moving them into position with the CSS attributes margin_left, margin-right and margin-top. The following function triggers all further actions to happen after the fade of the first span has been completed. Can anyone of you give me a hint how to trigger actions to happen at the same time?

<script>
$('#logo span').eq(0).fadeIn(10000, function(){
    //this is the callback function.
    //when the above fade completes, anything in here will run immediately after.
    $('#logo span').eq(1).fadeIn(5000);
    $('#logo span').animate({ 'margin-top': '-210' }, 'slow');
});</script> 

Answer 1

Thank you again folks for all your help you gave me here. I inserted a font-size animation which gives it a nice finishing touch. In case you need this once I thought like adding it as a final post and answer! Saludos!

<!-- targeting the first, second and third logo span (image logo) to be faded in right after another, being moved synchroniously, animating font-size and finally displayed in a opocity -->
    <script>
    var oldSize = parseFloat($("#logo span.movie").css('font-size'));     
    var newSize = oldSize  * 3.9;
    $('#logo span').eq(0).fadeIn(1000, function(){
    //this is the callback function.
    //when the above fade completes, anything in here will run immediately after.
    $('#logo span').eq(1).fadeIn(800);
            $('#logo span').eq(1).animate({ 'margin-left':'0' }, {duration:5000, queue: false});
        $('#logo span').eq(2).fadeIn(5000);
            $('#logo span').eq(2).animate({ 'margin-left':'0' }, {duration:5000, queue: false});
                    $('#logo span').eq(0).animate({opacity: 0.7}, {duration: 5000, queue: false});
                    $('#logo span').eq(1).animate({opacity: 0.6}, {duration: 9000, queue: false});
                    $('#logo span').eq(2).animate({opacity: 0.9}, {duration: 5000, queue: false});
                    $("#logo span").eq(2).animate({ fontSize: newSize}, {duration: 5000, queue: false});        

    });</script>