I've got an object that I've made draggable using GSAP Draggable. What I'm wanting to do is basically reset the position after the object is dragged (i.e., as soon as you let go of the object, it jumps back to where it was before the drag started).
It looks like Draggable is moving the object using transform: translate3d(x, y, z). So, I've tried to reset those values using jQuery by doing the following:
var drag = Draggable.create($dragger, {
type: "x,y",
onDragEnd: function(e) {
$dragger.css({
transform: "translate3d(0px, 0px, 0px)"
})
},
});
It works, up until I try dragging the object again. Seems like Draggable remembers where it was last dragged/dropped, ignores the translate3d position I manually set, and starts the drag where it left off last time.
Is there a better way to do this? Perhaps a way to simply set the position of an object using GSAP code? Or a way to get Draggable to forget the position it was in on the last drag and reset?
I thought about using TweenLite/TweenMax to set the position w/ 0 duration, but that seems like an ugly solution. Any ideas?