jQuery를 드래그 되돌리기 및 이벤트

Question

첫 번째 질문에 중지는, 그럴 종류 :

내가 뭘하려고 오전 사용자가 드래그를 해제하는 함수를 호출하고, 되돌리기 애니메이션이 완료되기 전에.

내가 알 수있는 한, 되돌리기가 끝난 후에 만 ​​중지 이벤트가 호출됩니다. draggable의 되돌리기 옵션에 함수를 전달하려고 시도했지만 작동하지 않습니다. 여기에 설명 할 코드가 있습니다.

$("a").draggable({ 
    helper:function(){ 
     return $("<div/>",{id:"mydrag",text:"link"}).appendTo("body"); 
    }, 
    revert:function(evt,ui){ 
     // $("#mydrag").fadeOut("slow"); 
     return true; 
    }, 
    stop:function(evt,ui){ 
     console.log("fin"); 
    } 
}); 

되돌리기 기능 - fadeout의 첫 번째 줄의 주석 처리를 제거하면 요소는 사라지지만 되돌릴 수 없습니다. 되돌리기 애니메이션이 완료되면 콘솔에 "fin"만 기록됩니다.

아무도 도와 줄 수 있습니까? 말할 필요도없이 나는 대답을 많이 봤지만 행운이 없다.

버스터

Answer 1

우선, this blog에있어서, 상기 미등록 revert 콜백은 단일 인자 (드롭 소켓 객체 또는 드롭이 거부 된 경우 부울 false)에 걸린다.

이제는 draggable이 내부적으로 animate()을 사용하여 도우미의 위치를 ​​변경합니다. 분명히 그 애니메이션은 대기열에 들어가고 fadeOut 효과가 끝난 후에 시작됩니다. 당신이 원하는 것을 달성하기 위해

한 가지 방법은 다음과 같이 animate() 자신을 호출을 수행하는 것입니다 :

이 복귀되는 동안 드래그 도우미가 페이드 아웃 할 수 있습니다

revert: function(socketObj) { 
    if (socketObj === false) { 
     // Drop was rejected, revert the helper. 
     var $helper = $("#mydrag"); 
     $helper.fadeOut("slow").animate($helper.originalPosition); 
     return true; 
    } else { 
     // Drop was accepted, don't revert. 
     return false; 
    } 
} 

.

해당 솔루션 here을 테스트 할 수 있습니다.