Trouble using jQuery UI resizeable and draggable together -


I am trying to allow the dropped element to be draggable and resetable within the pants container.

This is my CSS:

  .toolitem {padding: 5px 10px; Background: # ECCCC; Limit: 1 px solid silver} .Labelitim {width: 114px; Padding: 10px5px; Color: # 222; Background: #ff; Range: 1px solid silver}   

Here's my HTML:

  & lt; Header & gt; & Lt; Ul & gt; & Lt; Li & gt; Div id = "atool" class = "toolitem droppable" & gt; A & lt; / Div & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; Div id = "btool" class = "tooltip droppable" & gt; B & lt; / Div & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; Div class = "clear" & gt; & Lt; / Div & gt; & Lt; / Header & gt; & Lt; Section ID = "Container" />   

This is my JS:

  $ (".toolitum"). Draggable ({Opacity: 1, Tolerance: 'Fit', Helper: 'Clone'}); $ ("# Container"). Droppable ({accept: '. Droppable', drop: function (event, UI) {// Check for new or previously deleted element var = IU.draggable.data ("dropped"); if (dropped = = Null & amp; left! = "1") {// A new element is only once labeled as var label = $ ('
[label] & lt; / div & gt; ; ';;) Set the label dropped as the label. Make the new element dragable inside the data ("left", "1"); // parent label (Drug Gate: (' Stop: ' Guardian, grid: [2, 2], helper: 'original'}); // parent Resize the new element within the force ({prevention: 'parent'}); // attach the new element to the parent's label. AppendTo (this);}}});

The above code is executed properly, except for the discarded divas, it is not resizable. Please help.

I resolved it myself after googling for one hour, I think I was missing the following:

     

It was necessary to change the size of the div styles, now everything is working as expected, but weird it has never been mentioned in the jQueryUI documentation or I missed it .

Comments