애니메이션 : 시간이 아닌 속도를 지정하십시오.

Question

나는 플러시 가능 요소 $myElement과 revert: true을 가지고 있습니다. 이제 revertDuration을 지정하면 되돌리기 애니메이션이 완료되는 데 걸리는 시간이 결정됩니다.

제 생각에는 애니메이션의 속도는 $myElement이 원래 위치에서 얼마나 떨어졌는지에 따라 크게 달라집니다.

합니다 (총 시간 반대) 속도 애니메이션의을 지정하는 방법이 있습니까? http://jqueryui.com/demos/position/

당신은 드래그 할 수있는 요소의 오프셋을 얻을 수 있습니다 : 당신이 필요로하는 무엇

Answer 1

는 jQuery를 UI에 대한 position 플러그인은 여기에서 찾을 수 있습니다. 또는 단순히 사용 : 내 마음에 오는

var x = $myElement.offset().left 
var y = $myElement.offset().top 

해결 방법 : 요소의 저장 위치 드래그 객체의 start 이벤트가 발생합니다. 그런 다음 '중지'이벤트가 발생하고 다시 animate 시작 오프셋까지 요소를 수행하십시오. 오프셋의 차이는 길이가 뒤로 이동하는 데 필요한 시간에 비례하는 선입니다.

var x,y; 
$myElement.draggable({ 
    start: function(event, ui) { 
     x = $myElement.offset().left; 
     y = $myElement.offset().top; 
    }, 
    stop: function(event, ui) { 
     // count the length of the line from starting point 
     // and trigger back animation 
    } 
}); 

당신은 stop 이벤트가 animate을 피하기 위해라고하지만 그것이 전에 애니메이션으로 복귀 할 경우 내가 모를 때 시간을 되돌릴 설정하려고 할 수 있습니다

.

$(".selector").draggable("option", "revertDuration", 1000);