0

I want to write a sortable list using jQuery.

My thought is as follows: As the li element moves with mouse, a placeholder will be placed dymatically where the li element will be placed when mouseup event happens.

But I don't get one thing: How to make the other li elements move up and down appropriately as the placeholder moves. I don't think I should use CSS 'top' property to move these elements as this method actually doesn't change the index of each element in the list automatically. Could someone give me some idea on this? Thanks.

Improve this question
5
  • 2
    why not try fiddling around with the jQuery UI source? it has a developer bundle which you can take apart and study. Commented Apr 26, 2012 at 11:35
  • really... I dont get it. Why not to use something is ready for. People gave time and blood to build that things. Commented Apr 26, 2012 at 11:35
  • +1 to @Joseph - if you can't figure out how to do it look at the source of something that does. there is a wealth of very good JS code out there that does amazing things, and it's just sitting there in full human readable source code form, begging someone to make good use of it! and if you code something really nice and nifty that's better than what you started with, please make it available in turn to show your appreciation of this fantastic system. spread the love bro. Commented Apr 26, 2012 at 11:38
  • needless to say I can't think of a plugin that does this other than jQuery UI :) Commented Apr 26, 2012 at 11:38
  • 1
    a minimized jquery ui that only supports sortable is 34k. Is that really too heavyweight? That's a third of the size of jquery itself. Commented Apr 26, 2012 at 11:42

1 Answer 1

Reset to default
1

Actually jQuery UI allows you to choose which parts of it you want in your script. So you can choose only sortable (it will have three other dependencies, but nothing particulary large). Just go to jQuery UI homepage and click build custom download. You can get a very lightweight script this way (which you can further strip down if you choose readable code in your download).

It helps your code cross-browser compatibility and jQuery UI code is actually readable and easy to strip down of any unnecessary functionality (you can probably remove for example scrollSensitivity setter).

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

+1 jQuery UI's modular nature makes it easy to customize a build so that you use only the bits you need :)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.