> 웹 프론트엔드 > JS 튜토리얼 > 이미지의 비례적인 크기 조정을 달성하는 JS 방법(C# 버전 코드 사용)_javascript 기술

이미지의 비례적인 크기 조정을 달성하는 JS 방법(C# 버전 코드 사용)_javascript 기술

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
풀어 주다: 2016-05-16 15:27:05
원래의
1198명이 탐색했습니다.

이 기사의 예에서는 JS에서 이미지 크기를 비례적으로 조정하는 방법을 설명합니다. 참고하실 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.

js 버전:

function resizeImage(obj, MaxW, MaxH)
{
 var imageObject = obj;
 var state = imageObject.readyState;
 if(state!='complete') 
 {
  setTimeout("resizeImage("+imageObject+","+MaxW+","+MaxH+")",50);
  return;
 }
 var oldImage = new Image();
 oldImage.src = imageObject.src;
 var dW = oldImage.width; 
 var dH = oldImage.height;
 if(dW>MaxW || dH>MaxH) 
 {
  a = dW/MaxW; b = dH/MaxH;
  if( b>a ) a = b;
  dW = dW/a; dH = dH/a;
 }
 if(dW > 0 && dH > 0) 
 {
  imageObject.width = dW;
  imageObject.height = dH;
 }
}

로그인 후 복사

사용이 매우 간단합니다. /// <summary> /// 按比例缩放图片 /// </summary> /// <param name="imgUrl">图片的路径</param> /// <param name="imgHeight">图片的高度</param> /// <param name="imgWidth">图片的宽度</param> /// <returns></returns> public static string GetImageSize(string imgUrl,int imgHeight,int imgWidth) { string fileName = System.Web.HttpContext.Current.Server.MapPath(imgUrl); string strResult = string.Empty; if(System.IO.File.Exists(fileName) && imgHeight != 0 && imgWidth != 0) { decimal desWidth;decimal desHeight;//目标宽高 System.Drawing.Image objImage = System.Drawing.Image.FromFile(fileName); decimal radioAct = (decimal)objImage.Width/(decimal)objImage.Height;//原始图片的宽高比 decimal radioLoc = (decimal)imgWidth/(decimal)imgHeight;//图片位的宽高比 if(radioAct > radioLoc)//原始图片比图片位宽 { decimal dcmZoom = (decimal)imgWidth/(decimal)objImage.Width; desHeight = objImage.Height*dcmZoom; desWidth = imgWidth; } else { decimal dcmZoom = (decimal)imgHeight/(decimal)objImage.Height; desWidth = objImage.Width*dcmZoom; desHeight = imgHeight; } objImage.Dispose(); //释放资源 strResult = "width=\"" + Convert.ToString((int)desWidth) + "\" height=\"" + Convert.ToString((int)desHeight) + "\" "; } return strResult; }

로그인 후 복사
이 기사가 JavaScript 프로그래밍에 종사하는 모든 사람에게 도움이 되기를 바랍니다.

관련 라벨:
js
이전 기사:jquery 플러그인 ajaxupload는 파일 업로드 작업을 구현합니다. 다음 기사:JS 작업 XML 예제 요약(XML 파일 및 문자열 로드 및 구문 분석)_javascript 기술
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
관련 주제
더>
인기 추천
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿