Question: This is a bit of a challenge. Here's what I'm looking for:

1. 3 divs on screen
2. Div 1 resides in the middle of the page (centered)
3. Div 2 resides just off the screen on the far left
4. Div 3 resides just off the screen on the far right
5. `OnClick`, Div 1 slides to the position Div 2 was (to the left), Div 2 slides off the screen entirely, Div 3 slides to where Div 3 was (middle, centered). A new div arrives on the right.

I've tried using jQuery animation and AddClass. jQuery doesn't like sliding a div offscreen. 

Any thoughts?

For an example of what I'm describing, visit [Groupon.com](http://www.groupon.com/). I thought it was a cool idea, and have given myself the challenge of recreating it. So far, no dice.

-D

Answer: 
Maybe I misinterpreted. I though you wanted three divs in a row, and only the ones on the end sliding and whatnot.

<http://jsfiddle.net/acsfy/>

(I know you're using jQuery for this, but it pissed me off as I was trying to force it to work. You'd have to adapt this for your purposes.)
And... not a year too late. If you want it to start on the first div, your css needs to look like this. 

```

    #box1 { background-color:#333; }
    #box2 { background-color:#333; left: -50%; }
    #box3 { background-color:#333; left: 150%; }
    #box4 { background-color:#333; left: 150%; }
    #box5 { background-color:#333; left: 150%; }

```