티스토리 뷰

자바스크립트를 이용해서 이미지의 현재 나타나 있는 가로,세로 사이즈와

해당 이미지 원본의 가로,세로 사이즈를 구할수 있다.


코드는 아래와 같다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
  function myinfo(obj){
    $("#myimgwidth").text(obj.width);
    $("#myimgheight").text(obj.height);
    $("#myimgnaturalWidth").text(obj.naturalWidth);
    $("#myimgnaturalHeight").text(obj.naturalHeight);
  }
</script>
<img id="myimg" src="http://test.com/img.jpg" width="850" border="0" onload="javascript:myinfo(this);">
<div style="padding:10px">
img width : <span id="myimgwidth"></span><br />
img height : <span id="myimgheight"></span><br />
img naturalWidth : <span id="myimgnaturalWidth"></span><br />
img naturalHeight : <span id="myimgnaturalHeight"></span>
</div>
cs



실행 화면은 아래와 같다



저작자 표시 비영리 변경 금지
신고
댓글쓰기 폼

티스토리 툴바