jQuery를 사용하여 이미지 크기를 비례적으로 조정하는 방법: 종횡비 유지?

jQuery를 사용하여 이미지 크기를 비례적으로 조정: 가로 세로 비율 유지

jQuery의 크기 조정 기능은 큰 이미지를 처리할 때 유용합니다. 크기를 조정하는 동안 이미지 비율을 유지하려면 다음 접근 방식을 활용하세요.

논리:

여기에 사용된 계산AspectRatioFit 함수는 원하는 최대 너비와 높이, 원래 가로 세로 비율을 효과적으로 보존합니다.

구현:

<code class="js">function calculateAspectRatioFit(srcWidth, srcHeight, maxWidth, maxHeight) {
  var ratio = Math.min(maxWidth / srcWidth, maxHeight / srcHeight);
  return { width: srcWidth*ratio, height: srcHeight*ratio };
}</code>

사용 예:

<code class="js">// Calculate and apply new dimensions to the image
var newDimensions = calculateAspectRatioFit(originalWidth, originalHeight, maxWidth, maxHeight);
$(imageSelector).width(newDimensions.width).height(newDimensions.height);</code>

이 방법을 사용하면 이미지의 원래 모양과 비율을 유지하면서 비례적으로 크기를 조정할 수 있습니다.

위 내용은 jQuery를 사용하여 이미지 크기를 비례적으로 조정하는 방법: 종횡비 유지?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!