I am using the Sortable class to sort divs in one or more lists. I
have to build this in a manner so that it should work with different
templates i.e. I have no control over the 'position' and other
attributes of the DIVs.
More specifically, for those familiar with Joomla!, I'm trying to
allow drag and drop of modules into different positions. This implies
that I have to make it work with different templates.
When I set 'clone:true' in the object of the Sortable class, for some
templates, the cloned div appears at random positions . To get a
better idea, you can look at the following screenshots. The div with
the dashed border is the one being dragged.
Screenshots:
http://img.skitch.com/20090709-k1dhe62qnucqcx4kjj9rjnsxi2.jpg
http://img.skitch.com/20090709-tgc6xfche339i4xs49ny9q696q.jpg
All the DIVs have the same parent. Any idea which property may be
causing the problems? And how can I solve this problem ( maybe by
repositioning the clone somehow? ) ? It is important to have the clone
to have a better UI experience for the user.
You can have a look at the divs properties by going here:
http://ankitahuja.com/playground/joomla ( Drag and drop is not enabled
in this demo yet)
Also, any other approach that I can take to this besides using the
Sortable class? I'm under time constraints so do not have the time to
build the entire thing from scratch using Drag.Move.