jQuery를 사용하여 창 크기 조정에 반응하는 바닥글을 만들려면 어떻게 해야 합니까?

jQuery 창 크기 조정 이벤트 핸들러

제공된 jQuery 코드는 페이지가 처음 로드될 때 창 높이에 따라 바닥글 요소의 스타일을 수정합니다. . 그러나 창 크기 조정 중에 스타일이 동적으로 적용되도록 하려면 이벤트 리스너를 창 크기 조정 이벤트에 바인딩해야 합니다.

jQuery 솔루션:

$(window).on('resize', function() {
  var $containerHeight = $(window).height();
  if ($containerHeight <= 818) {
    $('.footer').css({
      position: 'static',
      bottom: 'auto',
      left: 'auto'
    });
  }
  if ($containerHeight > 819) {
    $('.footer').css({
      position: 'absolute',
      bottom: '3px',
      left: '0px'
    });
  }
});

추가 고려 사항:

• 다음과 같은 경우 CSS 미디어 쿼리 사용을 고려하세요. 화면 높이에 따라 스타일을 수정하려고만 합니다.
• 크기 조정 이벤트 처리 빈도를 제한하려면 Underscore 또는 Lodash와 같은 라이브러리에서 디바운스 또는 스로틀 메서드를 탐색하세요.
• 여러 이벤트 핸들러 바인딩을 피하세요. 성능 문제가 발생할 수 있으므로 창 크기 조정 이벤트를 사용하세요.

위 내용은 jQuery를 사용하여 창 크기 조정에 반응하는 바닥글을 만들려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!