Question

I trying to create a custom object that contains image, and then add this object to the document.
For example:

function ImageObject(path, name, type) {
   this.name = name;
   this.type = type;
   var img = new Image();
   addListener(img, 'load', function () {
      // RESIZE THE IMAGE AND DO OTHER MANIPULATIONS HERE
   });
   img.src = path;
}
var newImg = new ImageObject(test.jpg, 'my test', 'background');

Then I would like to add the object to the document like I add an normal Image and see the loaded image on the page. Something like: $(#container).append(newImg ). How is it possible to do that? Thanks.

Answer 1

You can make your ImageObject() function return the img:

function ImageObject(path, name, type) {
    this.name = name;
    this.type = type;
    var img = new Image();
    addListener(img, 'load', function () {
        // RESIZE THE IMAGE AND DO OTHER MANIPULATIONS HERE
    });
    img.src = path;
    return img;
}

Then you should be able to append it to the DOM, as far as I know.