Довольно часто картинка на странице показывается в масштабе, и при попытке определить её размеры из скрипта вы получите размер контейнера, а не самой картинки.
Разберемся как получать реальные размеры изображения.
В общем, нет особых хитростей. Контейнер img имеет два свойства naturalWidth и naturalHeight, которые и предоставляют необходимую информацию. Данные свойства поддерживаются всеми современными браузерами.
Пример кода:
|
|
var imgElement = $('img').get(0); var width = imgElement.naturalWidth; var height = imgElement.naturalHeight; |
Свойства становятся доступными после загрузки изображения браузером.
Данная запись опубликована в 17.09.2018 22:00 и размещена в рубрике javaScript.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Июль 13, 2021 г.
Культовая игра "жизнь", теперь и на js. Давным давно я делал реализацию игры на delphi (в 1999?). Хотя старая реализация до сих пор рабочая, но запустить ...
Читать
Июнь 9, 2017 г.
HTML select с флагом multiple позволяет сделать выбор нескольких значений. В этой статье мы рассмотрим как правильно обработать данные, используя javascript ...
Читать
Октябрь 31, 2018 г.
Широкое применение мобильных устройств для доступа в интернет накладывает свои специфические требования на разработку веб-сайтов. Привычный обработчик onclick может срабатывать совместно с ontouchstart, а может не срабатывать вовсе на мобильном устройстве. ...
Читать
Октябрь 26, 2015 г.
Одна из типичных задач для улучшения пользовательского интерфейса на сайтах - это визуализация ожидания загрузки/обновления страницы. Наиболее частый случай ...
Читать