2010-12-29 3 views
3

이 같은 약 보이는 마크 업이 있습니다jQuery UI Sortable 도우미의 오버플로를 제어 할 수 있습니까?

<div class='root'> 
    <div class='wrapper'> 
     <div class='column'> 
      ... 
     </div> 
     ... 
    </div> 
</div> 

루트 사업부는 overflow: auto을 가지고 있으며, 너비/높이 변경 될 수있다. 기둥은 고정 폭을 가지며 왼쪽으로 떠있었습니다. 래퍼는 열 너비의 합에 해당하는 고정 폭을가집니다. 최종 결과는 열 높이 또는 전체 열 너비가 경계를 초과 할 때 스크롤 막대를 표시하는 뷰 내에 가로로 배치 된 열 집합입니다.

래퍼 div에 정렬 가능한 jQuery UI를 적용하여 내부의 열을 정렬 할 수 있습니다. 이것은 하나의 문제를 제외하고는 훌륭하게 작동합니다. sortable은 정렬되는 요소를 position: absolute으로 지정합니다. 이는 분명히 일반 레이아웃에서 제거합니다. 따라서 열이 매우 크면 요소가 다시 제자리에 떨어질 때까지 전체 페이지에 스크롤 막대가 생깁니다.

정렬 도우미가 정렬하는 동안 스크롤 div에 포함 된 상태로 남아있을 수있는 방법이 있습니까?

답변

1

나는 이것이 당신에게 도움이 될 것이라고 생각합니다.

다음으로 정렬 도우미를 추가 할 위치를 선택할 수 있습니다 : 워드 프로세서

$(".selector").sortable({ appendTo: 'div.wrapper' }); 

:

"appendTo가 : 마우스로 이동 도우미가시에 추가되는 정의 드래그 (예 : 중복/zIndex 문제 해결). "

관련 문제