Move one image inside other image

Question

Background

I am allowing user to upload an image inside mask image....

Once user upload image, I am filling user uploaded i

Answer 1

You need the image to be draggable so first we need a container for it to be wrapper to listen to the dragover event and listen to the dragstart event on the image itself hence we able to calculate the drag distance and apply it as css translation Please check the following pen i've forked it from yours and apply the changes also I've added listen to onwheel event and apply zoom in and zoom out for the image and on same way

I recommend you to apply flip horizontal and flip vertical and image rotation

enter code here

https://codepen.io/anon/pen/yZVPrp