Monday, 15 July 2013

position - jquery sortable floated elements with percent chaos -


After sorting the initial elements with percentage-based width, dragging the last item of a line to "sometimes" element The reason for this may be jump in the next line

This behavior is seen only when the container is specially in width ... and thus there is a random nature (mainly when the bootstrap style Sort the responsible elements such as columns made

For a simple example, see the link below ... Dragging the orange box will highlight the problem:

< Div class = "snippet" data-lang = "JS" data-hide = "false">

 < Code> $ (function () {$ ("#sortable"). Sortable ();});  
  #sortable {width: 23 9px; } #Sortable div {float: left; Width: 25%; }  
  & lt; Script src = "https://ajax.googleapis.com/ajax/libs/JQuery/1.1.1/jquery.min.js" & gt; & Lt; / Script & gt; & Lt; Script src = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js" & gt; & Lt; / Script & gt; & Lt; Div id = "sortable" & gt; & Lt; Div style = "background-color: red" & gt; 1 & lt; / Div & gt; & Lt; Div style = "background-color: blue" & gt; 2 & lt; / Div & gt; & Lt; Div style = "background color: green color" & gt; 3 & lt; / Div & gt; & Lt; Div style = "background color: orange" & gt; 4 & lt; / Div & gt; & Lt; / Div & gt;  

It seems that only one problem occurs when the container width is divided by the column. 75 balance. Such as a container width of 239 px and objects of 25% width (23 9/4 = 59.75).

The above example is browser behavior, but the fixed width applies to the random placeholder (or / and the assistant) and thus ensues chaos.

I have presented a bug with this about the jQuery UI ... but if someone has some good work for the time, I would appreciate it.

Cheers.

You can specify the assistant, which is dragged when sorting:

  $ ("# sortable"). Sortable ({helper: 'clone'});  

will now be cloned to pull the original div , so jQuery does not need to create a new element, which is clearly false.

Unfortunately I do not know whether there are other external influences or issues of rise, but it will work for your given example.

Context


No comments:

Post a Comment