Оставьте позицию на JQuery Draggable и Droppable

Question

У меня возникла проблема с положением элементов с отброшенными списками.

$(document).ready(function() { 
    $('.fw-sidebar li').draggable({ 
     cursor: "crosshair", 
     revert: "invalid" 
    }); 

    function enableDraggable(el){ 
     $(el).draggable({ 
      containment: ".fw-content", 
      cursor: "help", 
      grid: [ 80, 80 ] 
     }).css('position', 'absolute'); 
    } 


    $(".fw-content").droppable({ 
     accept: ".fw-sidebar li, .fw-content li", 
     drop: function(event, ui) { 
      //console.log(event); 

      $(this).removeClass("border").removeClass("over"); 

      var dropped = ui.draggable; 
      var droppedOn = $(this).find('ul'); 

      $(dropped).detach().appendTo(droppedOn); 

      enableDraggable(dropped); 
     }, 
     over: function(event, elem) { 
      console.log("over"); 
      $(this).addClass("over"); 
     }, 
     out: function(event, elem) { 
      $(this).removeClass("over"); 
     } 
    }); 

}); 

http://jsfiddle.net/96t0qwmg/2/

Я хочу сделать dragable список бросить в контейнер несколько элементов, а затем расположить их в сетке.

1) В моем примере, когда я удаляю ссылки из боковой панели в контейнер, они не фиксируются там, где я хочу.

2) Затем, когда я перемещаю 2 или 3 ссылки в содержании, они не выравниваются по сетке, как предполагалось. Не удалось выровнять две ссылки в одной строке.

Кто-нибудь знает, где я ошибаюсь?

Спасибо!

Answer 1

Изменение функции в этой

function enableDraggable(el){ 
    $(el).draggable({ 
     containment: ".fw-content", 
     cursor: "help", 
     grid: [ 80, 80 ] 
    }).css({'position': 'relative','left':'', 'top':''}); 
} 

JsFiddle