Center drag item on targetbox


on Drag and drop, how do I center the drag item on the targetbox when its dropped on it?


Ok i’ve tried the following, not sure if it correct, but how do I center the drag item over the target box ?

var dragSource = doc.findElementByDom(ui.draggable[0]);
var dropTarget = doc.findElementByDom(this);

var dPos = $(this).offset();
var offset = ui.offset;
dragSource.setPosition(dPos.left,dPos.Top );


In the drop event handler, you can center the drag source as follows:

// center drag source on drop target
var dX = ($(this).width() - ui.draggable.width()) / 2;
var dY = ($(this).height() - ui.draggable.height()) / 2;
	left: this.offsetLeft + dX,
	top: this.offsetTop + dY,

I’ve also updated the sample project to include this piece of code in your previous thread: How to get name of drop target - #2 by ToanLS


very cool. Thank you. I haven’t done much when it comes to coding with Saola.
Learning it as needed.