Довольно часто картинка на странице показывается в масштабе, и при попытке определить её размеры из скрипта вы получите размер контейнера, а не самой картинки.
Разберемся как получать реальные размеры изображения.
В общем, нет особых хитростей. Контейнер img имеет два свойства naturalWidth и naturalHeight, которые и предоставляют необходимую информацию. Данные свойства поддерживаются всеми современными браузерами.
Пример кода:
|
|
var imgElement = $('img').get(0); var width = imgElement.naturalWidth; var height = imgElement.naturalHeight; |
Свойства становятся доступными после загрузки изображения браузером.
Данная запись опубликована в 17.09.2018 22:00 и размещена в рубрике javaScript.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Июнь 18, 2023 г.
React компонент TextField библиотеки @mui/material - это сложный элемент и получить значение через свойство ref нельзя.
Разработчики понимали, что доступ к HTMLInputElement внутри компонента нужно предоставить, и потому реализовали свойство inputRef, ...
Читать
Январь 8, 2018 г.
Привычный в PHP и SQL тип данных timestamp отсутствует в javascript. Стоит ли говорить, что timestamp удобен для сравнения дат и для простых вычислений. Как получить его значение в JS?
В Javascript есть класс для работы с датами.
[crayon-6a673e7b603c2282909529/] ...
Читать
Февраль 19, 2020 г.
Шаблон для проверки состояния элемента input[type='checkbox']. Код проверяет отмечен элемент или нет.
[crayon-6a673e7b607b3778381677/]
Проверка выполняется с помощью метода is(), который читает в данном случае не атрибуты тега input, а именно ...
Читать
Февраль 16, 2020 г.
Ставший уже привычным элемент навигации внутри страницы - кнопка "Вернуться к началу страницы". Разберем как реализовать эту функцию.
План следующий:
Создать HTML код кнопки; (БОНУС) Прятать кнопку, если мы и так уже в самом верху страницы. ...
Читать