How to make jQuery effects run in sequence, not simultaneously?

What you want is a queue.

Check out the reference page http://api.jquery.com/queue/ for some working examples.

$( "#foo" ).fadeOut( 300 ).delay( 800 ).fadeIn( 400 );

You can supply a callback to the effects functions that run after the effect has completed.

$("#show-projects").click(function() {
    $(".page:visible").fadeOut("normal", function() {
        $("#projects").fadeIn("normal");
    });
});