Full Drag and drop tutorial with animate cc HTML5 Canvas

Thank you so much!!!!!!!!!!!!!!!!!!!!!!!!!!! Menjli. This is really helpful.

kind regards,

Hagos

Great tutorial, very cool.

Modifying your code I have added multiple draggers, in their 'pressup' functions I have added the line: box.gotoAndStop("b_present");

b_dragger.on("pressup", function(evt) {
  if(intersect(evt.currentTarget, destination)){
  
     box.gotoAndStop("b_present"); 
     stage.removeChild(b_dragger, destination);
     stage.update(evt);
  
  }else{
       
b_dragger.x = 922;
b_dragger.y = 768;
     }
});

For every dragger that intersects the "destination" i want the 'box' to change in appearance, by making it jump to another frame within it.

This is not working and is not throwing any errors in the console... the other commands in the function still work but my 'gotoAndStop' does not.

How is it possible to trigger a command that does that within the function?

It's odd that the line doneDrag.gotoAndPlay(1); does work, but box.gotoAndStop("b_present"); or even box.gotoAndPlay(5); does not work?

What is the difference?

Thanks.

If you looking for help I can give you a working example which even works in firefox with a new Animate CC Version and a new EaselJS Version and a responsive Size of the canvas Element, because your youtube example does not work with this conditions.

There is a also a much easier way to get the "dropTarget rectangle"

Take a look at: this youtube Tutorial:

Drag and Drop, Animate CC, Canvas - YouTube