Довольно часто картинка на странице показывается в масштабе, и при попытке определить её размеры из скрипта вы получите размер контейнера, а не самой картинки.
Разберемся как получать реальные размеры изображения.
В общем, нет особых хитростей. Контейнер img имеет два свойства naturalWidth и naturalHeight, которые и предоставляют необходимую информацию. Данные свойства поддерживаются всеми современными браузерами.
Пример кода:
|
|
var imgElement = $('img').get(0); var width = imgElement.naturalWidth; var height = imgElement.naturalHeight; |
Свойства становятся доступными после загрузки изображения браузером.
Данная запись опубликована в 17.09.2018 22:00 и размещена в рубрике javaScript.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Январь 25, 2018 г.
Поп-ап на картах гугл, объект google.maps.InfoWindow, привлекателен возможностью вставки в него собственного HTML контента. Но кастомизация внешнего вида ...
Читать
Июнь 21, 2025 г.
Когда вы используете Fancybox для отображения изображений, SVG и других медиа-объектов, возникает интересная проблема: если внутри SVG находятся ссылки (<a>), они перестают работать. Почему? Потому что Fancybox «перехватывает» клик, и вы не попадаете ...
Читать
Март 13, 2010 г.
Недавно я затеял некоторую деятельность по созданию он-лайновой игрушки. Это из разряда хобби, и пока вообще речь не об этом. Возможно, я что то напишу об этом позже.
В отправной точке, при создании он-лайновой игрушки, я стоял перед скромным выбором ...
Читать
Сентябрь 7, 2013 г.
Эта задача из разряда useability. Drupal может штатно создавать блоки вертикальных иерархических меню.
Неудобным будет тот случай, когда мы хотим попасть на страницу в глубине иерархии этого меню. Нам придется последовательно заходить на родительские ...
Читать