jQuery popup box animation

Question

I am interested in writing my own lightweight popup box for my own websites. I like the way the soundcloud popup box animation works (click Sign In at the top left to view) but, from what I can tell, it is proprietary and not a plugin.

How do soundcloud achieve the "zoom" style effect where by the popup animation seems to come from the thing you clicked. I would like to replicate this effect.

Answer 1

It's just a geometry thing. Just increase the box dimensions as you move it towards the center of the screen, and apply the effect with jQuery's .animate() .

There's actually an example on jQuery's page: http://api.jquery.com/animate/

Looks quite similar to what you want.

Answer 2

maybe you can modified from this library, it has animation and draggable. The code is quite very simple. JQuery based: http://www.okyfirmansyah.net/blog/?p=166