I want to implement drag drop functionality using jQuery Masonry layout

Question

There are online examples where you can drag and drop pannels which are positioned relative. but i want the divs to be placed with position absolute and should not collide each other.

its kinda griddy layout without any white spaces.. and i want exactly like the Masonry jQuery layout with drag and drop functionality.

Answer 1

There has been some demos with regard sorting jquery masonry on this page:

https://github.com/desandro/masonry/issues/45

Below are the links to demos found in the above link:

http://tyler-designs.com/masonry-ui/

http://jsfiddle.net/XMfwZ/

http://jsfiddle.net/desandro/XMfwZ/1/

It seems to be still a work in progress and is unsupported in masonry itself.

The author suggested that the closest implementation would be:

http://jqueryui.com/demos/sortable/#display-grid

Answer 2

Try jquery.shapeshift.

Demo at: http://mcpants.github.io/jquery.shapeshift/