Website Page Transition Script Using Javascript/jQuery NOT FLASH

I am building a website for a client starting up a creative agency in London. I have built the 4 pages he needs and have the basic structure worked out. Each page is very simple and contains three black columns of equal width (33%) with just thin white spaces between. On each page the columns contain different content but always stay as three columns.

I need some help with creating page transitions (on click) so that when the user navigates between the pages, the columns change width during the first couple of seconds (but without using Flash).

For example...
1) The user is on the homepage and can see three equal columns (divs) of 33% width each.
2) They click a link to another page.
3) On click that page opens and initially the 3 columns remain 33% but then an animation makes the three columns change widths. The middle div stretches from the original 33% width to 50% width and the two either side are reduced to 25% each (SEE PICTURES).
4) If the user goes back to the homepage then it needs to do the reverse and stretch back to 33% each.

So what I need is a script, the basic html and the CSS that I can incorporate into the website to add this smooth transition effect. It can be very basic as I will style it etc. Just needs to be three black columns on a white background.

I will show you the website so far and will explain in more detail the pages that need the transitions...

So if you are experienced in Javascript/Jquery I hope it shouldn't be too difficult a task.

I would like it completed by tomorrow evening if possible.

Thanks in advance!