Take the 2-minute tour ×

I was wondering if someone could conceptually walk me through this? I want to use kineticjs to drag and drop an image from my desktop into the browser canvas. However, I only want to make parts of the canvas "droppable".

For example, if I have a canvas width:600, height:400, and I have a square in it, 80x80, how would I only make that 80x80 square droppable? so that only when I drag an image over that square can I drop an image from my desktop into it?


share|improve this question
You should really accept some answers. We all like helping people on this site, so its nice to accept answers so future users who have the same issue can see the selected solution. Its also nice to get rep as an appreciation for taking the time to answer your question. –  Loktar Jan 10 '13 at 23:44
Can you put your existing code in a jsfiddle to play around? –  Ani Jan 11 '13 at 2:15
add comment

1 Answer

up vote 3 down vote accepted

You should really try doing a search first for tutorials on how to drag and drop stuff from the desktop into the browser and into the canvas.


Essentially, combine FileAPI and KineticJS to achieve the effects you want.

share|improve this answer
add comment

Your Answer


