Animation: specify speed, not time
I have a draggable element $myElement
with revert: true
. Now specifying revertDuration
will determine the time the reverting animation will take to complete.
My problem is that the speed of the animation will vary greatly depending on how far $myElement
is dropped from the original location.
Is there a way of specifying the speed of th开发者_StackOverflow社区e animation (as opposed to the total time)?
What you need is position
plugin for jQuery UI found here: http://jqueryui.com/demos/position/
You can get offset of the draggable element. Or simply use:
var x = $myElement.offset().left
var y = $myElement.offset().top
Solution which comes to my mind:
Save position of the element when start
event of draggable object is fired. Then do the same when 'stop' event occurs and animate
the element back to starting offset. The difference in offsets is a line which its length will be proportional to the time required to travel back.
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
}
});
You can try to set revert duration when stop
event is called to avoid animate
but I don't know if it make it before revert animation.
$( ".selector" ).draggable( "option", "revertDuration", 1000 );
精彩评论