Проблема с шириной изображения в Google Chrome

Я пишу простой плагин jQuery, который отображает изображения с определенным классом в центре экрана (при нажатии в полный размер). Я использую этот html-код, где отображается мое изображение:

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

В атрибуте «src» я помещаю путь к полноразмерному изображению, жду события загрузки, где я делаю анимацию с помощью jQuery:

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

Но в Google Chrome (и только в Google Chrome) при срабатывании события onload this.width равно ширине предыдущего изображения. Это означает, что когда я впервые устанавливаю «src» в «img/1.jpg» с шириной 800 пикселей, все в порядке, но когда я пытаюсь установить второе изображение «img/2.jpg» в «src» с шириной 600 пикселей, this.width по-прежнему возвращает 800 пикселей (в событии 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 chrome.