Jqueryui draggable between Jquery layout sections

Question

here's a jsfiddle of what I'm trying to do

           $( ".dragcomp" ).draggable({
                cursorAt: {
                    left: 0
                },
                zIndex: 300,
                revert: "invalid",
                helper: "clone",
                distance: 10

            });

You'll notice that when trying to drag the divs in the left column to the middle section it stays trapped in the left one and just scrolls it. Is someone able to help me solve this issue?

score 1 · Accepted Answer · answered Mar 17 '13 at 10:24

You can specify the appendTo option to reparent the helper element under an ancestor of your pane structure (for instance the <body> element itself):

$(".dragcomp").draggable({
    appendTo: "body",
    cursorAt: {
        left: 0
    },
    zIndex: 300,
    revert: "invalid",
    helper: "clone",
    distance: 10
});

You will find an updated fiddle here.

Jqueryui draggable between Jquery layout sections

1 Answers1