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

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

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

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

Пример кода:

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

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

Как получить кол-во слайдов в slick слайдере

Апрель 9, 2024 г.

Слайдер классный, а вот документация какая то вялая. Сначала нужно найти DOM элемент, куда подключен slick, а потом получить объект слайдера, в котором можно прочитать множество свойств, в том числе и число слайдов: [crayon-6a61fb0243484485360983/]

Читать

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

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

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

Читать

Работа с html select в режиме multiple, отличия от обычного режима

Июнь 9, 2017 г.

HTML select с флагом multiple позволяет сделать выбор нескольких значений. В этой статье мы рассмотрим как правильно обработать данные, используя javascript ...

Читать

MUI TextField с маской

Июль 4, 2023 г.

В MUI компонентах мне не хватало поддержки ввода с маской. Давайте подключим библиотеку imask к mui компоненту TextField для ликвидации этого пробела. Установите в ваш проект библиотеку imask (https://imask.js.org/), и сам материал https://mui.com. ...

Читать
 

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

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



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