jQuery에서 고정 높이에서 자동 높이로 Div에 애니메이션을 적용하는 방법은 무엇입니까?

jQuery에서 요소를 자동 높이로 애니메이션화하는 방법

jQuery를 사용하여 고정 높이에서 자동 높이로 변경하는 경우 일부 사용자는 어려움을 겪을 수 있습니다. 이 문제에 대한 해결책은 다음과 같습니다.

제공된 코드:

$("div:first").click(function(){
  $("#first").animate({
    height: "auto"
  }, 1000 );
});

브라우저가 고정 값에서 "자동"으로 높이 변경을 애니메이션화하지 않기 때문에 문제가 발생합니다.

원하는 애니메이션을 얻으려면 다음 단계를 따르세요.

1. 저장 현재 높이:

var curHeight = $('#first').height();

2. 일시적으로 높이를 "자동"으로 설정:

$('#first').css('height', 'auto');

3. 자동차를 타세요 높이:

var autoHeight = $('#first').height();

4. 현재 높이를 복원하고 자동 높이로 애니메이션 적용:

$('#first').height(curHeight).animate({height: autoHeight}, 1000);

이것은 솔루션은 먼저 현재 높이를 검색하여 다음으로 설정될 때 브라우저가 최종 높이를 결정할 수 있기 때문에 작동합니다. "자동."

위 내용은 jQuery에서 고정 높이에서 자동 높이로 Div에 애니메이션을 적용하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

jquery auto using this animation

성명：

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.