Hi there,

I've tried to achieve a simple thing with draggables. Put little
pictures (wrapped in divs) on top of a bigger one using the drag-and-
drop technique. This is what I've come up with:

function makeDraggable(expr) {
/**
 * Makes the selection (by expr) draggable
 */
    $(expr).draggable(
        {
            start: function() {
                // only clone if clone is not yet present
                if ( $(".draggedClone").length == 0 ) {
                    if ($(this).next().is("#addons .draggable")) {
                        $(this).next().before($(this).clone().css("position",
"static").addClass("draggable").addClass("draggedClone"));
                    }
                    else {
                        $(this).clone().css("position",
"static").addClass("draggable").addClass("draggedClone").appendTo($
(this).parent());
                    }
                    $(this).attr("id", $(this).attr("id") + '_' + ($
(".draggable").length + 1) );
                    $(this).addClass("dragged");
                }
                makeDraggable(".draggable");
            },
            stop : function(){
                // $(".draggedClone").removeClass("draggedClone");
                // FIXME: remove dragged element if not dropped in the drop area
            }
        }
    );
}

$(document).ready(function(){
    (...)
    makeDraggable("#addons .draggable");
    $("button[name='rebind']").click(function() {
        $("#addons .draggable").toggleClass("highlighted");
        makeDraggable("#addons .draggable");
    });

});

What happens is that the initial draggable divs work fine. They can be
dragged and dropped onto the big image. But the created clones do not
respond to dragging (i.e they are not draggable). I think they should
because of the makeDraggable(".draggable") line in the start function
of the draggable.

I've created the 'rebind' button to explicitly assign dragability to
the clones but it did not help. (I've only added the
toggleClass("highlighted") to see if the selection formula is correct,
it is.

Has anyone had the same problem or is this a bug? (I've tried in
several browsers none of them worked). Or am I being silly?

Thank you for your help in advance,
Balint

Reply via email to