jquery text slide effect like in google+ Event

Question

I'm searching for an text slide animation plugin for jquery or some tips how to do this by my self. The animation I like to use in my own projects is this: https://plus.google.com/events/cq5653ic2pdnqmkiti7tt192n34/111697084657487423167 To see which animation I meen, click at the blue arrow. I'm searching for this animation where the text seens to come off the background of the text(or div-box) above.

Do you know if there is already a jquery effect plugin like this? Or have you some ideas how to realize something like this with jquery or CSS3 Transformation?

Thank you very much!

Answer 1

It looks like the opening effect was created by animating some CSS3 transformation properties. in this example: (from what I see)

-webkit-transform: rotateX();

To my knowledge there are no jQuery plugins that have that exact effect, but jQuery Transit will get you pretty close as far as animating those properties.

I also worked up an demo. View it here. Obviously you would have to incorporate some toggle logic and make it look pretty, but it looks as though the effect isn't all that hard to recreate!

Thanks much!