minhein

It is exactly what I would like to build. It works well. This one is useful stuff, var snaps = [0, 1, 1, 0]; newSnap = snaps === 0 ? [-62, 0] : [0, 62]; Thank you so much for this one. I will use more features from Greensock stuff in my upcoming projects.

yes, it is fixed value either left or right and the centre. First box 1 always goes to either in the left or the original centre point. For box 2 always goes to either in the right or the original centre point. But box 3 still goes into the right or the original centre. box 4 goes to the left or the original centre. It is not an alternative pattern.

yes, it is correct. Box1 can only be in the left column or the centre origin. But for other Boxes, they can be in the right column or the centre origin too. So, each box can be dropped to either in the left or right column and the centre point.

Nice one. Thanks. But I actually want to drop the box 1 in the left column, not in the right column. How do I restrict that?

I want to drag the blue box from the origin point to the point which is in the left column. Also, it should be able to drag and drop it back to the original centre point. When a user drags the blue box, the user should be able to drag it within three columns. But when the user releases the mouse or touch screen, should go to the nearest point, either the original point or drop zone point which is in the left column. Thanks, Craig. https://codepen.io/minhein/pen/OGPgao

Hi Craig Thanks, please see this one,

Hi I am having issue with drop. Boxes sit on the centre axis and there are left and right drop zones of that centre axis. If user want to drop a box to left drop zones, can drag and drop it there. There is lockaxis option (x), can drag it straight to the target drop zone. Also can drag it back to the original centre point. left zone ---- centre point ---- right zone I am using ThrowPropsPlugin licence version. But I couldn't figure it out. If there is any scenario, it would be great. Enlighten me if there is a way. Thanks.