Как в javascript получить реальные размеры картинки (тег img)

Довольно часто картинка на странице показывается в масштабе, и при попытке определить её размеры из скрипта вы получите размер контейнера, а не самой картинки.

Разберемся как получать реальные размеры изображения.

В общем, нет особых хитростей. Контейнер img имеет два свойства naturalWidth и naturalHeight, которые и предоставляют необходимую информацию. Данные свойства поддерживаются всеми современными браузерами.

Пример кода:

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

Мало букафф? Читайте есчо !

Когда jQuery.find может не работать

Декабрь 8, 2012 г.

Обычно, "проблема" возникает с данными, получаемыми через асинхронные запросы (ajax-запрос). Вы пытаетесь выполнить jQuery.find() для полученных данных, а функция возвращает пустой объект. В примере ниже, мы пытаемся извлечь содержимое HTML контейнера ...

Читать

Идем на поклон к Хроносу или самодельный cron на javascript

Март 13, 2010 г.

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

Читать

Вставка html entites в текстовые ноды

Апрель 5, 2025 г.

Делюсь еще одним лайфхаков, как в плагине CKE5 вставить htmlentity. При вставке текста в модель, CKEditor будет преобразовывать html символы вроде '&' и '>'. Но что делать, если нужно вставить символ в виде html кода? Рассмотрим следующий ...

Читать

Украшательства на сайте : делаем надпись поверх картинки

Март 13, 2013 г.

Долгая, вообще, история с картинками. Хорошо, если есть шаблон, где предусмотрены позиции картинок, может быть какой то слайдер или галерея. А все картинки ...

Читать
 

Комментарии к «Как в javascript получить реальные размеры картинки (тег img)»

Понравилась статья? Есть вопросы? - пишите в комментариях.



Комментарий: