jQuery 크기 조정 문제 정렬 가능 크기 조정 가능 draggable

Question

정렬 가능한 크기 조정 가능한 드래그 가능한 복제 된 포틀릿을 만들었지 만 크기를 조정할 때 버그가 발생합니다.

내 스크립트 :

<script type="text/javascript"> 

$(function() { 
    $('#column1').draggable({ 
     helper:'clone', 
     connectToSortable:'#sort', 
     handle:'.widget-head', 
    }); 

    $('#sort').sortable({ 
     handle:'.widget-head', 
     connectWith: "#sort", 
     out: function (e,ui) { 
      $("#sort").children().resizable({ axis: 'x',containment: 'parent', 
       resize: 
       function(event, ui) 
       { 
        ui.size.width = ui.originalSize.width; 
       } 
      }); 
     } 
    }); 
}); 

</script> 

Answer 1

나는 문제가 스타일링에 관련이 있다고 생각하고 문제를 해결할 수 있었다. 위치가 크기가 변경 될 때마다 절대 값으로 바뀌므로이를 처리하기 위해 다음을 사용합니다.

$('#sort').sortable({ 
    handle:'.widget-head', 
    connectWith: "#sort", 
    out: function (e,ui) { 
     $("#sort").children().resizable({ 
      axis: 'x', 
      containment: 'parent', 
      resize: function(event, ui) { 
       ui.size.width = ui.originalSize.width; 
       (ui.helper).css({'position': '', 'top': '0px'}); 
      } 
     }); 
    } 
});