Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 27.04.2015, 20:58
LCH LCH вне форума
Интересующийся
Отправить личное сообщение для LCH Посмотреть профиль Найти все сообщения от LCH
 
Регистрация: 31.07.2012
Сообщений: 13

Получить 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() ширина/высота возвращаются нормально, а как мне их использовать вне этой функции?

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

Последний раз редактировалось LCH, 27.04.2015 в 21:01.
Ответить с цитированием
  #2 (permalink)  
Старый 27.04.2015, 21:07
Аватар для Safort
Профессор
Отправить личное сообщение для Safort Посмотреть профиль Найти все сообщения от Safort
 
Регистрация: 23.12.2013
Сообщений: 1,856

http://stackoverflow.com/questions/6...ing-javascript
Ответить с цитированием
  #3 (permalink)  
Старый 27.04.2015, 21:18
LCH LCH вне форума
Интересующийся
Отправить личное сообщение для LCH Посмотреть профиль Найти все сообщения от LCH
 
Регистрация: 31.07.2012
Сообщений: 13

Спасибо за ответ. Я переписал так функцию:
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
Ответить с цитированием
  #4 (permalink)  
Старый 27.04.2015, 21:28
Аватар для Safort
Профессор
Отправить личное сообщение для Safort Посмотреть профиль Найти все сообщения от Safort
 
Регистрация: 23.12.2013
Сообщений: 1,856

LCH,
конечно, ведь данные ещё не успели загрузиться. Все операции с картинкой нужно проводить уже внутри onload.
Ответить с цитированием
  #5 (permalink)  
Старый 27.04.2015, 21:31
LCH LCH вне форума
Интересующийся
Отправить личное сообщение для LCH Посмотреть профиль Найти все сообщения от LCH
 
Регистрация: 31.07.2012
Сообщений: 13

Внутри да, все работает, а как передать переменную width/height изнутри onload, чтобы использовать ее?
Ответить с цитированием
  #6 (permalink)  
Старый 27.04.2015, 21:37
Аватар для Safort
Профессор
Отправить личное сообщение для Safort Посмотреть профиль Найти все сообщения от Safort
 
Регистрация: 23.12.2013
Сообщений: 1,856

LCH,
как-то так.
var imgWidth, imgHeight;

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

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


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



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
плагин для создания эффекта затемнения всей страницы кроме выбранного элемента DOM рони Ваши сайты и скрипты 57 05.01.2015 19:29
При добавлении DOCTYPE "плывут" размеры input type=text Demath (X)HTML/CSS 4 08.07.2012 19:27
Оцените, пожалуйста код вёрстки OlegALL Ваши сайты и скрипты 18 26.07.2011 09:35
Водяной знак на fancybox bobrina Общие вопросы Javascript 1 03.06.2011 21:11
свойства width и height в IE.... alex.v Internet Explorer 18 29.09.2009 12:03