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

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

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

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

Пример кода:

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

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

Чтение GET параметров в JS

Октябрь 7, 2018 г.

Как прочитать GET параметры на стороне клиента из кода на javascript? Бывают ситуации, когда нужно что то сделать из JS в зависимости от переданных параметров ...

Читать

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

Март 13, 2013 г.

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

Читать

Многострочные константы в js

Сентябрь 19, 2018 г.

JavaScript в web был когда то всего лишь приятным дополнением. А сейчас сложно найти сайт, который не использует скрипты. А если уж часть шаблона формируется скриптом, то без много-строчных констант не обойтись. Но в javascript с ними не так все ...

Читать

Сообщение Cannot read property 'msie' of undefined

Апрель 13, 2017 г.

Два вероятных случая могут генерировать данное сообщение в консоли браузера. Раннее обращение к js плагину Те или иные свойства могут быть недоступны, если вы обращаетесь к методам и свойствам до того как они определены. В данном случае обращение ...

Читать
 

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

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



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