[javascript] html element의 실제 width


[javascript] html element의 실제 width

HTML 객체 ( ex. img ) 를 회전(rotate) 했을 때 이미지가 차지하는 영역 ( width, height ) 가 달라지게 된다. 아래와 같이 가로 100, 세로 50의 객체 ( <img src="이미지경로" id="imgTest" width="100" height="50" /> ) 가 있을 때, 회전을 하게 되면 실제 객체의 영역이 변경되게 된다. ( 붉은색 테두리 ) 이 경우 width를 구하기 위해 - document.getElementById("imgTest").width - $("#imgTest").width() - $("#imgTest").outerWidth() 등을 사용하면 원래 객체의 넓이인 100 이 return 된다. var img = document.getElementById('imgTest'); //or however you get a handle to the IMG var width = img.clientWidth; var height = img....


#element #getBoundingClientRect #javascript #rotate #rotation #width

원문링크 : [javascript] html element의 실제 width