Довольно часто картинка на странице показывается в масштабе, и при попытке определить её размеры из скрипта вы получите размер контейнера, а не самой картинки.
Разберемся как получать реальные размеры изображения.
В общем, нет особых хитростей. Контейнер img имеет два свойства naturalWidth и naturalHeight, которые и предоставляют необходимую информацию. Данные свойства поддерживаются всеми современными браузерами.
Пример кода:
|
|
var imgElement = $('img').get(0); var width = imgElement.naturalWidth; var height = imgElement.naturalHeight; |
Свойства становятся доступными после загрузки изображения браузером.
Данная запись опубликована в 17.09.2018 22:00 и размещена в рубрике javaScript.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Декабрь 17, 2018 г.
При работе с HTML документом из JavaScript одной из типовых операций является установка значения того или иного атрибута выбранного контейнера (тега).
Vanila JS
В чистом js (vanila) значение атрибута можно установить следующим образом:
[crayon-6a342fa2b0fe2237203217/] ...
Читать
Март 17, 2023 г.
Рассмотрим как организовать юнит-тестирование для проектов на TS. Предполагается, что проект управляется npm. Потребуется установить три пакета для организации ...
Читать
Май 4, 2017 г.
Писал ранее об API ipinfo.io. Сервис позволяет вытащить как гео координаты, так и названия города, региона, страны. Единственный недостаток - информация на английском языке. В данной статье рассмотрим пару примеров использования сервиса.
Обращение ...
Читать
Март 12, 2024 г.
Есть устаревший способ, с которым можно ознакомиться здесь, а ниже мы рассмотрим рекомендуемый подход.
Для работы с буфером обмена был внедрен Clipboard API.
Он позволяет не только двунаправленно работать с буфером обмена, но также и обрабатывать ...
Читать