Проверка размера изображения

Прошу помощи, есть слайдер на сайте, фотографии все разного размера, как сделать проверку на js чтоб при добавлении фотографии пропускало только один размер, например(450х350), и оповещало если непрвавильно подобран размер?


Ответы (1 шт):

Автор решения: Pavel Grishaev
// Находим все картинки слайдера:
// (у вас будет свой селектор или уже готовый массив картинок)
let imagesArray = Array.from( document.querySelectorAll('img') );

// Проверяем реальный размер каждой картинки, а не тот, что отображается:
imagesArray.forEach(( img, index )=>{
  if( img.complete ){
    checkImageSizes( img, index );
  } else {
    img.addEventListener( 'load', ()=> checkImageSizes( img, index ) );
  }
});

function checkImageSizes( img, index ){
  if( img.naturalWidth > 450 || img.naturalHeight > 350 ){
    alert(`Картинка под индексом ${index} слишком большая!`);
  }
}
→ Ссылка