Sexy collapsible login block with jquery slide effect

We have learned before how to create a slide up toggle with jquery to mimic facebook chat panel where it slides vertically bottom up. Another common variant is blind toggle, or slide down.

Now we are going to try different approach to how slide method works in jquery. To have a better idea on how it works, you may check it here.

We are trying to slide a whole login block horizontally.

How to compact forms with jquery alone

There can be another way to make compact form with jquery, the built-in jquery functions. If you have a simple need, such compacting a login block, and don't want to install another plugin or module, what I have done below may hopefully suffice. You can see the demo in the sidebar. Nothing fancy, only simpler:-) The best, useful or reasonable placement may be in a narrow horizontal space somewhere in your crowded design, but a vertical one should do for the demo now. We are going to elaborate how to make a horizontal login bar later more with CSS.

Back to Top