Получить width and height изображения.
 

Здравствуйте!

Пытаюсь написать функцию, но пока не выходит, прошу помощи.

Суть:
На странице есть ссылки на изображения. Это обычные текстовые ссылки. Я беру атрибут href каждой ссылки, создаю для каждой такой ссылки объект Image и добавляю его на страницу используя метод append() jquery. Потом мне нужно получить ширину/высоту изображения, чтобы спозиционировать его. И вот здесь начинаються трудности:

theImg = new Image();
theImg.src = link;
$(theImg).on('load', function(){
var imgWidth = this.width;
var imgHeight = this.height;
$('body').append($(this));	
})

Внутри .on() ширина/высота возвращаются нормально, а как мне их использовать вне этой функции?

И правильно ли я вызываю методы для получения высоты/ширины?

Спасибо за ответ. Я переписал так функцию:

theImg = new Image();
theImg.src = link;
var imgWidth = theImg.clientWidth;
var imgHeight = theImg.clientHeight;
theImg.onload = function(){
$('.body').append(this);
}
console.log(imgHeight);

Но console.log возвращает 0

LCH,
конечно, ведь данные ещё не успели загрузиться. Все операции с картинкой нужно проводить уже внутри onload.

Внутри да, все работает, а как передать переменную width/height изнутри onload, чтобы использовать ее?

LCH,
как-то так.

var imgWidth, imgHeight;

theImg = new Image();
theImg.src = link;

$(theImg).on('load', function() {
  imgWidth = this.width;
  imgHeight = this.height;
  $('body').append($(this)); 
})

Но помни, что это не рекомендуется, т.к. может привести к некоторым ошибкам.