[Draggable#update() doesn't work inside onDragStart callback since version 1.16.0]

Thanks for quick reply, Carl!

 

Passing true for the applyBounds apparently works.

 

And I've found that this modification also helps:

TweenLite.set(element, {
  x: '+=' + deltaX,
  y: '+=' + deltaY,
  immediateRender: false,
  onUpdate: function() { draggable.update(); }
});

[Draggable#update() doesn't work inside onDragStart callback since version 1.16.0]

Hello,

 

I'm trying to align the center of a draggable element to the cursor position at start of dragging.

var element = document.getElementById('block');
var draggable = new Draggable(element, {
  onDragStart: function centerAlignElementToCursor(e) {
    var rect = element.getBoundingClientRect();
    var centerX = (rect.left + rect.right) / 2;
    var centerY = (rect.top + rect.bottom) / 2;
    var deltaX = e.clientX - centerX;
    var deltaY = e.clientY - centerY;

    TweenLite.set(element, {
      x: '+=' + deltaX,
      y: '+=' + deltaY
    });
    draggable.update();
  }
});

See full code in the referenced Codepen.

 

It works as expected in 1.15.1, but doesn't work since 1.16.0.

It looks like the call to draggable.update() is ignored inside the onDragStart callback.

 

How it can be fixed?

See the Pen WQNBxr by dened (@dened) on CodePen