Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.09.2013, 15:06
Новичок на форуме
Отправить личное сообщение для Yzgramor Посмотреть профиль Найти все сообщения от Yzgramor
 
Регистрация: 22.09.2013
Сообщений: 4

Добавление изображений append'ом
Добрый день!
Не вычисляются ширина и длина изображений, добавленных при помощи append. Подробнее. Есть двумерный массив images с адресами изображений. Дальше при помощи append эти изображения вставляются в div с id='fotki0':

var count=0;
        for (var i = 0; i < images.length; ++i)
                   {
                        
                        for (var l = 0; l < images[i].length; ++l)
                        {
                           
                        $('#fotki0').append($('<img />').attr({'src': images[i][l], 'id':count}));
                       count++;
                        }
                  }


Дальше мне, к примеру, нужно извлечь ширину, скажем, картинки с id=4:

wid=$('#4').width();
        alert(wid);


Этот алерт всегда будет выводить 0. Причем сначала запускается этот нулевой алерт, а потом уже, только после нажатия "ок" или "отмена", выполняется код с вставкой изображений, хотя хронологически в коде он находится раньше. Почему так происходит?

P.S. Я попробовал вместо изображений с такими-то адресами, выводить аналогично сами эти адреса:
var count=0;
        for (var i = 0; i < images.length; ++i)
                   {
                        
                        for (var l = 0; l < images[i].length; ++l)
                        {
                           
                        $('#fotki0').append('<div id="' + count + '">' +images[i][l]+ '</div>');
                       count++;
                        }
                  }


В этом случае ширина нужного мне уже дива с текстом вычисляется правильно.

Последний раз редактировалось Yzgramor, 22.09.2013 в 15:32.
Ответить с цитированием
  #2 (permalink)  
Старый 22.09.2013, 15:38
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

Потому что изображение ещё не загружено.

var images = [['1.jpg', '2.jpg'], ['10.jpg', '11.jpg']],
     count = 0,
     elem = document.getElementById('fotki0'),
     j, img;

for(var i=0; i<images.length; i++) for(j=0; j<images[i].length; j++) {
   img = new Image();
   img.alt = '';
   img.id = count;
   img.onload = function() {
      alert( this.width );
   }
   img.src = images[i][j];
   elem.appendChild(img);
}
Ответить с цитированием
  #3 (permalink)  
Старый 22.09.2013, 23:24
Новичок на форуме
Отправить личное сообщение для Yzgramor Посмотреть профиль Найти все сообщения от Yzgramor
 
Регистрация: 22.09.2013
Сообщений: 4

А почему тогда текстовые дивы к моменту обращения к их ширине уже загрузились? Более того, я ради эксперимента аппендом подгружал 10 000 дивов просто с номерами и вызывал ширину одного из последних - так алерт пару секунд ждал загрузки и потом выводил полученную величину. Почему в случае с подгрузкой изображений alert точно так же не ждет?
Извините за глупые вопросы, но я пока новичок и многого не понимаю(

Последний раз редактировалось Yzgramor, 22.09.2013 в 23:40.
Ответить с цитированием
  #4 (permalink)  
Старый 23.09.2013, 03:20
Профессор
Отправить личное сообщение для Яростный Меч Посмотреть профиль Найти все сообщения от Яростный Меч
 
Регистрация: 12.04.2010
Сообщений: 557

Сообщение от Yzgramor
А почему тогда текстовые дивы к моменту обращения к их ширине уже загрузились?
потому что там нечего "загружать", всё есть на месте.
а в картинках реально подгружаются данные - байты изображения.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
jquery-gp-gallery.js - разное отображение подгружаемых изображений frutality jQuery 1 09.09.2012 18:15
Повременная смена изображений jozev Элементы интерфейса 2 01.08.2011 18:43
Прокрутка изображений gen552 Элементы интерфейса 6 01.04.2011 13:11
Скролл мини изображений I-Trap Элементы интерфейса 1 25.11.2009 22:03
onLoad до изображений в IE vasa_c Events/DOM/Window 2 28.04.2009 13:09