EaselJS Load and drag images

http://www.createjs.com/#!/EaselJS

HTML

<script src="http://code.createjs.com/easeljs-0.6.0.min.js"></script>
Drag it:
<canvas id='display' width='640' height='300'></canvas>

CSS

#display {
    border: 1px solid #000000;
    margin: 50px auto;
    display: block;
}

JavaScript

var stageWidth = 640;
var stageHeight = 300;

var stage = new createjs.Stage(document.getElementById('display'));
stage.mouseMoveOutside = true;
// Add border

displayPicture = function (imgPath) {

    var image = new Image();

    image.onload = function () {

        // Create a Bitmap from the loaded image
        var img = new createjs.Bitmap(event.target)

        // scale it
        img.scaleX = img.scaleY = 0.5;

        /// Add to display list
        stage.addChild(img);

        //Enable Drag'n'Drop
        enableDrag(img);

        // Render Stage
        stage.update();

    }

    // Load the image
    image.src = imgPath;
}

enableDrag = function (item) {

    // OnPress event handler
    item.onPress = function(evt) {

        var offset = {  x:item.x-evt.stageX,
                        y:item.y-evt.stageY};

        // Bring to front
        stage.addChild(item);

        // Mouse Move event handler
        evt.onMouseMove = function(ev) {

            item.x = ev.stageX+offset.x;
            item.y = ev.stageY+offset.y;
            stage.update();
        }
    }
}


stage.update(); 
createjs.Ticker.setFPS(40);
createjs.Ticker.addListener(tick);

function tick() {
    stage.update();
}


//displayPicture("http://www.your-domain.com/image.jpg")

//NOTE: In this JSFiddle We use a base64 image to avoid any restrictions when loading images from external domains:

displayPicture ( ...