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

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

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

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

Пример кода:

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

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

Программируем галерею в Drupal 7

Сентябрь 2, 2015 г.

Хотите сделать галерею своими руками, без сторонних модулей в Drupal? Тогда читайте дальше. Настроим поле для галереи Для начала нам надо определиться, ...

Читать

Чистим пользовательский ввод числа в javascript

Февраль 3, 2017 г.

Это еще одна из функций-хелперов. На этот раз мы пытаемся прочитать введенное пользователем число средствами javascript. Javascript уже имеет довольно не плохую функцию parseFloat(strValue). Но она обладает некоторыми особенностями. В частности, ...

Читать

Переменные окружения React для dev и prod

Сентябрь 15, 2023 г.

Если вы разрабатываете SPA на Reactjs, используя npx create-react-app my-app команду для создания проекта, то в коробке вы получаете множество полезных ...

Читать

Перебор атрибутов HTML элемента в javascript

Февраль 17, 2016 г.

За использованием библиотеки jQuery как то забываешь о базовых свойствах и методах DOM  в javascript. Как получить весь набор аттрибутов HTML элемента? Получим ссылку на элемент HTML документа каким либо образом: [crayon-69fd25ba64e40892601257/] ...

Читать
 

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

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



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