I'm fairly new to jQuery and this is my first post on this forum, so I apologize in advance if this turns out to be a dumb question.  Here is my problem: I have a slogan that is supposed be animated so that one part slides onto the screen, followed by the other part.  My understanding of the 'callback function' parameter on the .animate() function is that it's not supposed to execute until the animation is finished.  The trouble is, the two functions seem to be executing at the same time (that is, the two parts of the slogan appear on the screen at the same time.)  Here is my code:

2. $(document).ready(function() {
3.    // hide slogan text 
4.    $('#slogan_1').css('left','270px');
5.    $('#slogan_2').css('top','75px'); 
6. });
7. 
   
8. function slogan1Animate() {
9.    $('#slogan_1').animate({'left': '0'}, 1800, slogan2Animate() ); 
10. }
11. 
    
12. function slogan2Animate() {
13.    $('#slogan_2').animate({'top': '35'},1200);
14. }
15. 
    
16. $(window).load(function(){
17.    // slide onto screen
18.    setTimeout("slogan1Animate()", 500);
19.    });

Can anyone give me an idea of what I'm doing wrong?  Thanks in advance.