Question

I cant get correct size for image

Here is the HTML:

<img id="image" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif"
    height="20">


<div id="result"></div>
correct result: 76 

And the javascript:

var v1 = $('#image').height();
var v2 = $('#image').removeAttr('height').height();
var i =  $('<img>').attr('src',  $('#image').attr('src'));
var v3 = i.height()

i.one('load', function() {
    var v4 = $(this).height();
    $('#result').text(v1 + " " + v2 + " " + v3 + " " + v4);
}).each(function() {
    if(this.complete) {
        $(this).load();
    }
});

I used 4 methods, and all of them failed.
Updated: method 2 works, but I want to use method 4 because image may be not loaded at the moment of script execution.

Testing link: http://jsfiddle.net/cMZK7/7/

Answer 1

Full correct answer: https://stackoverflow.com/a/1944298/966972

(it was in comments for this question, but not in answers)