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

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

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

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

Пример кода:

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

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

Вертикальное уплотнение списка скриптом

Май 24, 2017 г.

Если вы занимаетесь версткой, то наверное, нередко верстаете элементы списков. Все выглядит красиво, если элементы однородны по ширине-высоте, тогда они ...

Читать

Связанные списки select с получением данных по ajax

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

В прошлый раз я показывал как можно "на лету" создавать списки html select, данные которых содержались в специальном javascript массиве. Подготовить такой ...

Читать

Идем на поклон к Хроносу или самодельный cron на javascript

Март 13, 2010 г.

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

Читать

Обработка событий загрузки изображения

Май 16, 2025 г.

В веб-разработке важно уметь правильно обрабатывать процесс загрузки изображений. Браузеру может потребоваться время на подгрузку файла, особенно при медленном соединении или больших изображениях. Задача разработчика — отслеживать статус загрузки изображения ...

Читать
 

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

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



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