オブジェクトコンストラクター内には、addToViewport()という名前のメソッドがあります。このメソッドは、画像をプリロードした後に画像を表示するだけの役割を果たします。
window.onload = function(){
function ViewportObject(){
this.src = "https://chart.googleapis.com/chart?cht=qr&chs=500x500&chl=asdasdasd&choe=UTF-8&chld=L|0";
this.addToViewport = function(){
// Determine the DOM object type to create
var DOM_elem = "img",
obj = $(document.createElement(DOM_elem)),
img = new Object();
obj.addClass("object");
obj.css({"z-index":"100","width":"300px","height":"auto"});
// Preload the image before rendering it and computing its size
img.src = this.src;
img.onload = function(){
obj.attr("src",this.src);
obj.appendTo("body");
}
}
}
var o = new ViewportObject();
o.addToViewport();
}
私が遭遇した問題は、スクリプトが「onload」イベントハンドラーブロックに入らないため、画像が表示されないことです。ライブでチェックアウトできるように、上記と同じスクリプトを使用したWebページをhttp://picselbocs.com/test/にまとめました。
私がここで間違っているのは何ですか?