Довольно часто картинка на странице показывается в масштабе, и при попытке определить её размеры из скрипта вы получите размер контейнера, а не самой картинки.
Разберемся как получать реальные размеры изображения.
В общем, нет особых хитростей. Контейнер img имеет два свойства naturalWidth и naturalHeight, которые и предоставляют необходимую информацию. Данные свойства поддерживаются всеми современными браузерами.
Пример кода:
|
|
var imgElement = $('img').get(0); var width = imgElement.naturalWidth; var height = imgElement.naturalHeight; |
Свойства становятся доступными после загрузки изображения браузером.
Данная запись опубликована в 17.09.2018 22:00 и размещена в рубрике javaScript.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Май 16, 2025 г.
В веб-разработке важно уметь правильно обрабатывать процесс загрузки изображений. Браузеру может потребоваться время на подгрузку файла, особенно при медленном соединении или больших изображениях. Задача разработчика — отслеживать статус загрузки изображения ...
Читать
Декабрь 10, 2016 г.
В чистом виде js не даёт такой возможности. То как вы будет создавать копии ваших объектов - зависит от вас.
[crayon-6aee166569cdf841435220/]
т.к. А и B ссылаются на один и тот же объект.
Классика
Если идти классическим путем, то мы должны запрограммировать ...
Читать
Февраль 25, 2017 г.
Такая задача возникает не часто, но если вы заботитесь о пользователе, и помогаете ему скопировать в буфер обмена нужную информацию - то пользователь будет вам признателен. Так вы заработаете ещё один плюсик в копилку "юзабилити".
Разберем ключевые ...
Читать
Май 4, 2020 г.
Немного ванильного js, на этот раз: как найти контейнер по указанному классу.
Сразу рассмотрим более сложный пример, когда требуется найти элемент с классом .class-child внутри элемента .class-parent.
В DOM мы используем функцию element.getElementsByClassName(CLASSNAME), ...
Читать