jQuery 드래그 앤 드롭 순서도

Question

사람이 드롭 영역에 항목을 드래그하면 나머지 draggables가 열린 영역으로 이동하게됩니다. 예를 들어 :

{A} {1}

{B} {2}

{C} {3}

당신은 드래그하면 {3}는 것이다 {B}까지 {B}에 잠근 다음 {2}이 (가) {C}가있는 곳으로 내려 가야합니다 ...

아이디어를 얻으려면 어떻게해야합니까? 또한 * * 드래그 가능한 객체는 드롭 가능 영역에 스냅/잠금되어야합니다.

Answer 1

오케이, 마침내 작동하는 해결책을 찾을 수있었습니다. 누구든지 여기에 관심이 있다면 :

첫 번째로, 나는 빗방울 & 방울을 만들었습니다. 드래그 가능한 각 객체에는 삭제 가능한 영역이 있습니다. 그런 다음 draggables의 위치 지정을 위해 obj 높이와 마진 등을 기반으로 다른 위치를 저장하는 변수를 만들었습니다. draggables는 부모 DIV를 기반으로 수행되는 절대 위치를가집니다. 나중에 위치를 얻을 때 개체를 재배치 할 때 사용할 수 있습니다.

그런 다음 droppables에 대한 놓기 기능을 만들었으므로 개체를 놓으면 개체가 놓인 위치를 기록하여 이미 포착 된 위치의 배열입니다. 그래서 [Step 2]에서 무언가를 떨어 뜨렸을 때 맨 위에서 220px 떨어지면 배열에 기록했습니다. 바로 다음에이 객체를 확인하고 모든 객체를 확인합니다 어떤 것들이 떨어졌는지. 그래서 나는 어떤 물건을 움직일 수 있는지 알고있다.

이제 이동할 수있는 객체와 사용 가능한 위치가 있습니다. 그런 다음, 나는 단순히 움직이지 않은 열린 장소와 물체 목록을 통해 간단하게 열린 위치로 대체합니다. 오히려 요소의 위치 만 변경하려고합니다. 나는 본질적으로 관계없이 모든것을 재배치한다.

이 정보가 도움이되기를 바랍니다.