Image 엘리먼트

var image = new Image();

와 같이 빈 이미지 엘리먼트를 담은 오브젝트를 생성할 수 있다.

이 오브젝트 프로퍼티인 src에 이미지 주소값을 넣으면, width값과 height값이 자동으로 갱신된다.

var resize = function ($image) {
    
    var windowH = $(window).height() - 100;
    var windowW = $(window).width() - 80;
    var image = new Image();
    image.src = $image.attr('src');
    var imageH = image.height;
    var imageW = image.width;

왜 imageH = $image.height(); 를 사용하지 않는 것일까?

이유는 만약 매개변수로 받은 jQuery 오브젝트가 아직 document에 등록이 되지 않은 상태가 아니라

$('<img>')와 같이 코드상으로만 존재하는 경우(append되지 않은 경우) height, width값이 0으로 나타나기 때문에 src로 본래 이미지의 크기값을 받아오기 위해 위와 같이 코딩한다.