블로그 이미지

카테고리

데꾸벅 (194)
Publisher (39)
Scripter (97)
Programmer (1)
Designer (30)
Integrator (18)
Pattern Searcher (4)
News (2)
강좌 및 번역 (3)

최근에 올라온 글

최근에 달린 댓글

[출처 : PHPSchool]

쩝..IE7에서 보안이 강화되면서 미리보기 기능이 구현안돼서 헤매고 당기다 아지트에서 발견하다...

소스 :



<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<style type="text/css">
#previewPhoto {
 width:100%;
 height:100%;
 position:absolute;
 z-index:1;
 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);
}
#previewPhotoGara {
 width:115px;
 height:150px;
 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);
}
</style>
<script type="text/JavaScript">
<!--
function showPhoto(src) {
 if(src.match(/\.(gif|jpg|jpeg|png)$/i)) {
 // 복사용 개체에 그림 삽입하고 실제 크기 구하기
  var obj = document.getElementById("previewPhotoGara");
  obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "',sizingMethod=image)";
  var w = obj.offsetWidth;
  var h = obj.offsetHeight;
  /*if(w > 115) { // 가로 길이가 115 이상일 경우만 축소하기
   var x_axis = w / 115; // X축의 축소 비율 구하기
   var y_axis = parseInt(h / x_axis); // X축이 들어든 만큼 Y축의 크기를 축소한다.
  } else {
   var y_axis = h;
  }
  // 썸네일 컨테이너의 크기 조정
  document.getElementById("previewPhotoBox").style.width = '115px';
  document.getElementById("previewPhotoBox").style.height = y_axis + 'px';
  */

  // 썸네일에 그림 삽입하고 이상유무 첵~
  document.getElementById("previewPhoto").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "',sizingMethod=scale)";
 } else {
  alert("이미지 파일만 올려주세요");

 }
}
function killPhoto() {
 if(!confirm("사진을 취소하시겠습니까?")) return;
 document.getElementById("filePhoto").outerHTML = document.getElementById("filePhoto").outerHTML;
 document.getElementById("previewPhoto").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='noPhoto.gif',sizingMethod=scale)";
}
//-->
</script>
</head>
<body>


<DIV style="overflow:hidden; width:115px; height:150px"><!-- 썸네일 크롭핑 -->
<DIV id=previewPhotoBox style="width:115px; height:150px"><!-- 썸네일 컨테이너 -->
<DIV id=previewPhoto><!-- 썸네일 -->
</DIV>
</DIV>
</DIV>

<DIV style="overflow:hidden; width:1px; height:1px">
<DIV id=previewPhotoGara></DIV>
</DIV>

<input type=hidden id=verifyPhoto value=""><!-- 업로드 파일이 이미지 파일(jpg,gif)인지 최종판단 -->

<input type=file name=filePhoto id=filePhoto onchange="showPhoto(this.value)">
<input type=button value="사진취소" onclick="killPhoto()">

</body>
</html>

Post by 넥스트리소프트 데꾸벅(techbug)
, |