How do I learn how to create a quick and easy set of draggable panes in jQuery UI?

I want to enable the user to drag a bar up/down to reveal/开发者_运维问答hide content in two contiguous panes. I also need to create some buttons that move the bar to some preset locations. I know this is all possible, but am not sure where to start.

I'm creating a prototype whose purpose is to figure out the right user experience, so it's OK if it's not going to scale to 300 million simultaneous users on IE6/Windows Millenium. ;-)

---

That's a rather complicated thing to do from scratch, so consider using a plugin. Wijmo is based on jQuery UI and has an open-source splitter widget. The documentation is decent as well.

While I don't see any methods to resize it, you may be able to add one and contribute it back to the project.