问题
I have a div containing a few jquery draggables, however if at any point I remove one of these draggables from the page then this can move the rest of them as they are positioned with relative.
Here is a fiddle showcasing this: http://jsfiddle.net/VolatileStorm/aNk6e/
My proposed solution is that the draggable should be using absolute as opposed to relative positioning, however I can't find a way to do this. Is there a way to do this, and if not, can anyone think of a way around it? (For elegance's sake, I won't accept "don't delete the other draggable").
回答1:
Why doesn't position:absolute work for you?
Since absolutely positioned elements are no longer part of the document flow, each of your three <div>s are placed at 0,0 of its containing (positioned) element. Thus, it's up to you to work out the starting position of your draggables.
回答2:
- Add
position:absoluteto your elements. - Attach them to the DOM before calling
.draggable.
回答3:
You can set the position to be absolute by using the jQuery css function when setting an element to be draggable.
$(this).draggable().css("position", "absolute");
回答4:
Perhaps not the best ideas but... You could position all the relevant divs using positon:relative; and then include a function call in your or $("document").ready(), if you're using jQuery, whic iterates through each of the divs to translate their relative positions into absolute and set them as their left, top before changing them to position:absolute. Only problem here is that you'd want each divs absolute position prior to updating their styles so as not to alter the layout through iteration.
来源：https://stackoverflow.com/questions/6904531/jquery-ui-draggable-absolute-instead-of-relative