DRAG AND DROP IMAGES.

[plenoal152]

Hi, I have a script that works properly, shows an image and you can drag and drop that image. But my problem is: how I can add more images? I thought copying the code would appear another image, but it is not. Thank you.

 

<script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v5.0.2.min.js"></script><script defer="defer">function drawImage(imageObj) { var stage = new Kinetic.Stage({container: "container",width: 800,height: 600});var layer = new Kinetic.Layer();// darth vadervar darthVaderImg = new Kinetic.Image({image: imageObj,x: 100,y: 30,width: 40,height: 40,draggable: true});// add cursor stylingdarthVaderImg.on('mouseover', function() {document.body.style.cursor = 'pointer';});darthVaderImg.on('mouseout', function() {document.body.style.cursor = 'default';});layer.add(darthVaderImg);stage.add(layer);}var imageObj = new Image();imageObj.onload = function() {drawImage(this);};imageObj.src = 'adorno1.png';</script>

Edited November 28, 2014 by plenoal152

[justsomeguy]

I don't know what Kinetic is, but there are some things that should only be done once, and other things that need to be done for each image. For example, you might need only one stage or layer, but like I said I'm not familiar with Kinetic.