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

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

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

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

Пример кода:

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

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

JavaScript - как удалить элемент массива

Ноябрь 14, 2016 г.

Javasctipt. Есть массив из N элементов. Нужно удалить i-й. Решение: Нам нужен новый массив без i-го элемента. Если это не хеш, то используем функцию объекта Array.splice().  [crayon-6a6793653eb0c350985316/] Функция позволяет не только удалять, ...

Читать

jQuery плагин для ввода диапазона значений

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

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

Читать

Перемешиваем слайды перед началом работы в swiper.js

Март 27, 2021 г.

Когда слайдов много, то пользователи постоянно видят одни и те же слайды, что загружены первыми. Потому хотелось бы их переставлять в случайном порядке при каждой загрузке слайдера (я пользуюсь плагином swiper.js). Т.к. слайдер не даёт такой опции, ...

Читать

Виджетик для сравнения двух картинок

Ноябрь 1, 2015 г.

Этот виджет может найти применение для сайта дизайнера или фотографа, которые занимаются реставрацией или обработкой изображений. Наверное, приложений ...

Читать
 

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

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



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