Проблема с еще не загруженной картинкой через onload

[bgraf]

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

На странице несколько маленьких картинок при нажатии открывается большая, все банально .

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

function ImgSize(NumImg)
{

		var Img_Size = new Image()
		Img_Size.onload = function(){};
		Img_Size.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
		return Img_Size.width ;

}

Спасибо!

Edited January 25, 2012 by bgraf

[sammasati]

function ImgSize(NumImg)
{

                var Img_Size = new Image();
                $(Img_Size).load(function(){
                  return Img_Size.width ;
                });
                Img_Size.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
}

P.S. это jQuery

Edited January 25, 2012 by sammasati

[bgraf]

function ImgSize(NumImg)
{

                var Img_Size = new Image();
                $(Img_Size).load(function(){
                  return Img_Size.width ;
                });
                Img_Size.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
}

P.S. это jQuery

Скажите а что такое $(Img_Size).load ?

function ImgSize(NumImg)
{

                var Img_Size = new Image();
                $(Img_Size).load(function(){
                  return Img_Size.width ;
                });
                Img_Size.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
}

P.S. это jQuery

Как то вообще картинку не выводит этот код

function ImgSize(NumImg)
{

                var Img_Size = new Image();
                $(Img_Size).load(function(){
                  return Img_Size.width ;
                });
                Img_Size.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
}

P.S. это jQuery

Не работает. Картинка теперь вообще не появляется

[sammasati]

Бррр...бред написал. Сорри.

function ImgSize(NumImg)
{
                var img = new Image();
                var imageSize = 0;
                img.onload = function(){
                  imageSize = img.width;
                };
                img.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
                return imageSize;
}

Это обычный js, без jQuery.

Edited January 25, 2012 by sammasati

[bgraf]

Бррр...бред написал. Сорри.

function ImgSize(NumImg)
{
                var img = new Image();
                var imageSize = 0;
                img.onload = function(){
                  imageSize = img.width;
                };
                img.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
                return imageSize;
}

Это обычный js, без jQuery.

Спасибо, но Вы сделали тоже самое что и я, вопрос в другом, imageSize возвращает 0 так как сама картинка еще не успела загрузиться, а мне надо как то подождать пока она загрузится и тогда я получу ширину

[Great Rash]

function ImgSize(NumImg)
{
                var img = new Image();
                img.onload = function(){
                  return {w: img.width, h: img.height};
                };
                img.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
}

alert(ImgSize().w + ' ' + ImgSize().h);

А так?

[bgraf]

function ImgSize(NumImg)
{
                var img = new Image();
                img.onload = function(){
                  return {w: img.width, h: img.height};
                };
                img.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
}

alert(ImgSize().w + ' ' + ImgSize().h);

А так?

Нет.

[bgraf]

Люди, гуру Javascript, помогите!

Почему этот код, возвращает мне 0, и как мне решить задачу.

function ImgSize(NumImg)
{

                var Img_Size = new Image()
                Img_Size.onload = function(){};
                Img_Size.src = "designers/boris_letunov/images/" + arrImages[NumImg][1];
                return Img_Size.width ;

}

[Great Rash]

Код возвращет 0 потому что картинка на момент return'а еще не загружена. Вашу задачу решить нереально, есть мнение, что вы что-то не так задумали изначально. Опишите подробно, что вам надо сделать и для чего надо знать размер картинки именно до её загрузки?

[stars]

В чем проблема воспользоваться свойством onload для картинок?(на крайний случай создайте элемент повести на него событие onload далее присвойте src) Еще я где то видел варианты с созданием буферной копии, смысл в том что пока изображение не загружено копия не создается как только она создалась идет определение размеров ну и далее по скрипту...

[bgraf]

Задача банальна , при нажатии на маленькую картинку открываю большую в div при этом размер дива меняю относительно ширины картинки.

Проблему можно решить двумя способами . В скрытый див загрузить большие картинки и тогда они уже будут загружены, второй способ на сервере с помощью php получить размер больших картинок и передать их в массив js.

Так что решений хватает, но, я хочу именно по средствам js решить эту задачу, видел много примеров использования onload , в данной проблеме, но нигде не нашел решение своей проблемы. например решение проблемы в Lightbox галереи именно такое как я хочу, но не достаток знаний в области js, не позволяют мне разобраться с этой проблемой.

Ведь есть сайты где к примеру, пока загружается картинка крутится круг или песочные часики переворачиваются, тем самым пока картинка не загрузилась ничего не происходит. Только и такой пример найти не могу.

В чем проблема воспользоваться свойством onload для картинок?(на крайний случай создайте элемент повести на него событие onload далее присвойте src) Еще я где то видел варианты с созданием буферной копии, смысл в том что пока изображение не загружено копия не создается как только она создалась идет определение размеров ну и далее по скрипту...

пожалуйста дайте пример

[Great Rash]

Задача банальна , при нажатии на маленькую картинку открываю большую в div при этом размер дива меняю относительно ширины картинки.

Задача и решается банально. Посмотрите как устроен Lightbox, там при открытии большой картинки висит надпись Loading или крутится гифка, изображающая загрузку. Так надо и вам делать. Пока картинка грузится пишете Loading, как только у Image сработает событие onload надпись убираете, меняете размеры дива и показываете большую картинку.

[bgraf]

Задача банальна , при нажатии на маленькую картинку открываю большую в div при этом размер дива меняю относительно ширины картинки.

Задача и решается банально. Посмотрите как устроен Lightbox, там при открытии большой картинки висит надпись Loading или крутится гифка, изображающая загрузку. Так надо и вам делать. Пока картинка грузится пишете Loading, как только у Image сработает событие onload надпись убираете, меняете размеры дива и показываете большую картинку.

Вот именно. Дайте пример. Пожалуйста.

[Great Rash]

Тут есть несжатый код подобной галлереи с комментариями.

[bgraf]

Тут есть несжатый код подобной галлереи с комментариями.

Спасибо. Буду изучать

[bgraf]

Скажите а как узнать что изображение уже загрузилось?

[Great Rash]

Сработает событие onload.

var img = new Image();
img.onload = function() {
  alert('изображение загрузилось');
}
img.src = 'http://img.moskva.fm/uimg/artists/source/7f/7fcb86bd99addf0c4102757ed5f6729d.jpeg';

Попробуйте запустить этот код. Как только загрузится изображение появится алерт.

[bgraf]

Сработает событие onload.

var img = new Image();
img.onload = function() {
  alert('изображение загрузилось');
}
img.src = 'http://img.moskva.fm/uimg/artists/source/7f/7fcb86bd99addf0c4102757ed5f6729d.jpeg';

Попробуйте запустить этот код. Как только загрузится изображение появится алерт.

Работает но теперь проблема, как мне из моей функции вернуть значение ширины изображения?

[Great Rash]

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

[bgraf]

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

Спасибо уже изучаю. просто вопросы по ходу дела