javascript - JQuery UI resizable if <div> resized -> all siblings move too -
hi use jquery ui resizable , jquery ui draggable of 3 div elements.
the basic dom tree looks this:
so blue
, red
siblings , orange parent.
if resize blue
vertically red
automatically changes position vertical space between them stays same. problem not apply draggable
, can change vertical distance dragging blue
, red
around every time resize blue vertically red moves too.
if make blue bigger vertically -> red moves down, not want optimatically can make blue bigger vertically until hits border of red , thats it.
i tried several .css styles nothing works
here current .css use:
hi comments, find solution:
jquery ui resizable
adds .css attribute position:relative;
every resizable <div>
element. explain myself this:
this means normal position of red directely under blue, because of draggable
added, lets 20px of space dragging red down.
if resize blue, 20px of space preserved, moving red down.
when use position
: absolute !important; red positioned "relative first positioned (not static) ancestor element" orange
/*overrides '.ui-resizable' 'position:relative;' helps after resizing position of element placed relative parent <div>*/ position: absolute !important;
Comments
Post a Comment