Google Chromeでの画像の幅の問題

Question

私は、画面の中央に特定のクラスの画像を表示する単純なjQueryプラグインを作成しています（フルサイズのときはクリックします）。私はjQueryを使って、いくつかのアニメーションを作るところのonloadイベントを待つ、私はフルサイズの画像へのパスを置く「SRC」属性で

<div id="source"> 
    <img src="" alt="" /> 
</div> 

：私は私の画像が表示されているこのHTMLコードを、使用しています

$("#source img").load(function(){ 
var calcWidth = this.width + ... 
}); 

オンロードイベントが発生したGoogle Chrome（およびGoogle Chromeのみ）では、this.widthは以前の画像の幅と同じです。つまり、最初に "src"を800px幅の "img/1.jpg"に設定したときはすべてOKですが、600px幅の "src"に2番目の画像 "img/2.jpg"を設定しようとすると、 this.widthはまだ800pxを返します（onloadイベントで！）。
この現象を説明するには？

はUPD：私はこのようにSRCを設定
：

function NavClick(){ 
     $("#source img").attr({ 
      src: $(this).attr("src") 
     }); 
     currentImage = this.indx; 
    } 

「これは」サムネイル画像に参照される、私は、テストのみのサムネイルとフルサイズの画像に対して同じSRCを使用します後で別のディレクトリに配置します。
このコードは、私の問題を解決するが、私は正確に理解していない理由：

function NavClick(){ 
     $("#source img").attr({ 
      src: "#" 
     }); 
     $("#source img").attr({ 
      src: $(this).attr("src") 
     }); 
     currentImage = this.indx; 
    } 

私はそれを設定し、新しいSRCを設定する前に「＃」は、おそらくこれは、キャッシング・イメージによるものであるが、唯一のGoogleのクロムに表示されます。 。

Answer 1

使用ウィンドウのloadイベント、イメージが完全に画像のloadイベントにロードされていません（thisの質問を参照）

私はそれをテストしていないが、これは単にトリックを行う可能性があります、それはdoesnのなら、私に知らせて（もしあれば）

$(window).load(function(){  
    var calcWidth = $("#source img").width() + ...; 
});