naturalWidth, naturalHeight
폭은 300, 높이는 400 인 a.jpg 라는 이미지(원본)이 있을 경우
<img id="image" src="a.jpg" width="100" height="150" />
위처럼 사용하게 되면 a.jpg는 폭 100, 높이 150으로 축소가 되어서 출력이 된다.
document.getElementById("image").width 는 100 을 출력하고
document.getElementById("image").height 는 150 을 출력한다.
이때 이미지의 원본 크기를 알고 싶을 경우
document.getElementById("image").naturalWidth
document.getElementById("image").naturalHeight
로 알수 있다. 이는 각각 300, 400을 출력한다.
브라우저 지원 : 크롬, 오페라, 파이어폭스, 사파리, 익스플로러 9.0이상
jquery 에서는 사용할 경우
jquery Object 에는 naturalWidth, naturalHeight 값이 포함되어 있지 않기때문에
jquery Object 에 포함되어 있는 원본(dom Object)로 접근하여 사용해야 한다.
$("#image")[0].naturalWidth 또는 $("#image").get(0).naturalWidth 으로 접근이 가능하다.
jquery object를 html dom object로 변환하기
지원하지 않는 환경에서 방법
http://stackoverflow.com/questions/1832907/is-there-any-way-to-read-out-the-naturalwidth-of-an-image-with-jquery
