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

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

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

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

Пример кода:

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

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

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

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

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

Читать

Как убрать фокус, используя jQuery?

Сентябрь 22, 2016 г.

Не так принципиально, какой библиотекой мы воспользуемся, когда будем убирать фокус, я привык использовать jQuery. Потому речь пойдет в контексте этой библиотеки. Сложностей с тем как снять фокус с элемента традиционно больше, чем с тем, как его ...

Читать

Фильтр только по нужному столбцу в Angular

Декабрь 3, 2016 г.

Продолжая тему работы с ng-repeat в Ангуляр фреймворк, хочу рассказать о том, как работать с кастомными фильтрами. Можно вернуться к примеру в прошлой ...

Читать

Смещение карты только при двойном касании в Leaflet

Июнь 13, 2018 г.

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

Читать
 

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

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



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