Cannot "Fully" Drag Element to the Bottom or to the right

[paoloramos]

Hi,

I like your plugin as it would fill the needs for my requirement. However, I encountered a problem as I've described above. I cannot drag a draggable element all the way to the bottom or to the right. There seems to be some "padding" that blocks me from going all the way down.

By the way, I only encounter this problem with the latest version (latest draggable collision, collision and jquery, jquery ui modules). The old one works just fine.

Is there a quick fix for this?

Thanks!

[dsbaars]

Apologies for the delay, can you post the output of bower list? "Latest" version of all mentioned packages is to unclear when trying to reproduce your issue.

[Chocksy]

@dsbaars i experience the same issue and the solution i found was to comment out the lines here: https://github.com/dsbaars/jq-ui-draggable-collision/blob/master/js/jquery-ui-draggable-collision.js#L491

Why was this change necessary?

[playgamemy]

@dsbaars I encounter this same error, using 1.12.4 jquery and 1.11.4 jquery ui, with 1.0.2 jquery-collision and 1.0.2 jquery-ui-draggable-collision.

It only happens if there is containment set, and as @Chocksy pointed out, comment out line 491 to 493 can fix the issue, but the draggable may left the containment if it collide with obstacles.

I see this repo hasn't been updated for long and likely discontinued, but this library is one of a kind and I really hope it is still maintained, as I wouldn't image coding this myself. It probably will take you much less time to fix as you know the script much better than us. Thanks =]

[hailie-rei]

I've added a fix for that, calculating left and top of that $cont element. Instead of {left: cn[0], top: cn[1]} we are passing to offset method calculated top and left {left: left, top: top}

            var cn = widget.containment;

            // get offset from position of containment element
            const containmentElement = document.querySelector(widget.options.containment);
            const containmentRect = containmentElement.getBoundingClientRect();
            const left = containmentRect.left + document.documentElement.scrollLeft;
            const top = containmentRect.top + document.documentElement.scrollTop;

            $cont = $("<div />").offset({left: left, top: top}) // FIX: pass here calculated values
                .width(cn[2] - cn[0] + $(this).width())  // because it had the draggable's size chopped out :-P
                .height(cn[3] - cn[1] + $(this).height()); // because it had the draggable's size chopped out :-P