views:

526

answers:

1

I'm needing to make this layout editor that uses a good bit of jQuery for letting one resort the items on their resume. I envisioned showing a dialog with a graphical representation of the sections, sort of like:

[Details - locked -- immovable]
[Overview -- immovable, but can be hidden or shown again]
----imaginary line where things can not be moved above this---
[Career History -- movable]
[Key Skills -- movable + can be hidden or shown again]
[Education & Qualifications -- movable]
[Personal Interests -- movable + can be hidden or shown again]
---imaginary line where things cannot be moved below this--
[References -- immovable]

When items are moved, they would need to slide into their closest slot.

You wouldn't happen to know an example on the web that is even remotely similar to this, would you?

+1  A: 

jquery.ui.draggable and jquery.ui.sortable comes to mind.

http://docs.jquery.com/UI

Jimmy
I knew jQuery a good bit, but hadn't focused on drag and drop. I didn't realize it would be just as simple as $('#myUL').sortable(revert: true, scroll: true, opacity: 0.7, axis: 'y', containment: 'parent', cursor: 'move', items: '.movable'); and then making some items have the "movable" class.