Динамическое создание изображения и получение размеров с помощью jQuery

Question

Итак, я динамически создаю изображение и хочу получить размеры изображения.Возможно ли это сделать до того, как изображение будет прикреплено к DOM?На данный момент я делаю это:

 var arrow = $('<img src="' + parameters.arrowRight + '" />');
 arrow.load(function() {  
      console.log("size: " + $(this).height() + " " + $(this).width());
  });

, но высота и ширина указываются как ноль.Изображение на самом деле извлекается, поскольку я вижу запрос GET в firebug.

Answer 1

Нет. Невозможно получить размеры любого элемента, пока он не присоединен к DOM.

Обходной путь может дать изображение css: margin-left: -10000px. Затем вы можете добавить его, но он не будет виден. Затем вы можете получить его размеры и делать с ним по мере необходимости.

Answer 2

может быть, это поможет:

http://api.jquery.com/load-event/

Этот метод является ярлыком для .bind ('load', handler).

ЗагрузкаСобытие отправляется элементу, когда он и все вложенные элементы полностью загружены.Это событие может быть отправлено любому элементу, связанному с URL: изображениям, сценариям, фреймам, iframes и объекту окна.

Например, рассмотрим страницу с простым изображением:

<img src="book.png" alt="Book" id="book" />

Обработчик события может быть привязан к изображению:

$('#book').load(function() {  
   // Handler for .load() called.  
});