Please note, I have provided a full example of this in a later post here
I’ve spent a couple of months working with jQuery now and have grown to like it. For a sales pitch recently I used jQuery to put together a few forms and have been impressed by its power.
Here’s a quick example of a sliding div element.
<script>
jQ(document).ready(function(){$(“#div1″).slideUp(’slow’, function(){
$(“#div2″).slideDown(’slow’);
});});
</script>
And the HTML:
<html>
<body>
<div id=’div1′>div 1</div>
<div id=’div2′ style=’display:none;’>div 2</div>
</body>
</html>
This will result in div1 sliding up and div2 sliding down into its place on completion of the page load.
The jQuery will execute as follows:
- Firstly th script will wait for the document to be ready (loaded)
- It will then slide div1 up slowly
- Only on completion of div1 sliding up will div2 slide down
As you can see div1 only slides up once the document has loaded and div2 will only slide down once div1 has completed its ’slide up’. This takes all those handcrafted JS time delays out of the code – making things much much nicer 
