Question

I have a work around for this problem, but I’ve been noticing some peculiar behavior while goofing around with html/javascript (jquery).

I’ve noticed that moving elements to the right and down beyond the borders of a containing element will resize the containing element. As an example the reader is directed to http://jqueryui.com/demos/draggable/ . Try dragging the box to the right or below the containing box. This behavior is maddening.

How might you disable this annoying property? Most of my elements are position: relative because placing them in the order they are written is not very useful at all. This is just something I’ve noticed and would like some reasoning.

Answer 1

you can try containment:

Constrains dragging to within the bounds of the specified element or region. Possible string values: ‘parent’, ‘document’, ‘window’, [x1, y1, x2, y2].

$( ".selector" ).draggable({ containment: "parent" });