800px 이후 아래로 스크롤할 때 Div를 표시하고 위로 스크롤할 때 숨기는 방법은 무엇입니까?

800px을 다시 방문한 후 ScrollDown에 Div 표시

이 다시 논의에서는 아래로 스크롤할 때 숨겨진 div를 표시하는 접근 방식을 개선하는 것을 목표로 합니다. 페이지에서 800px 이후 top.

해결책:

우리는 다음과 같이 JavaScript의 $(document).scroll() 함수를 사용하여 간단한 솔루션을 사용합니다. 다음:

$(document).scroll(function() {
  var y = $(this).scrollTop();
  if (y > 800) {
    $('.bottomMenu').fadeIn();
  } else {
    $('.bottomMenu').fadeOut();
  }
});

설명:

1. scrollTop은 페이지의 현재 세로 스크롤 위치를 검색합니다.
2. scrollTop이 800픽셀을 초과하는 경우 , BottomMenu div는 다음을 사용하여 표시됩니다. fadeIn().
3. 반대로, scrollTop이 800픽셀 아래로 떨어지면 fadeOut()을 사용하여 BottomMenu가 숨겨집니다.

Scroll Up에 대한 개선 사항:

이 솔루션을 향상시키기 위해 위로 스크롤하고 스크롤 높이가 다음보다 작을 때 하단 메뉴를 숨기는 기능을 추가할 수 있습니다. 800px:

if (y < 800 && $('.bottomMenu').css('display') !== 'none') {
    $('.bottomMenu').fadeOut();
}

이 추가 조건은 위로 스크롤할 때 BottomMenu가 숨겨진 상태로 유지되고 스크롤 높이가 800px 미만이 되도록 보장합니다.

위 내용은 800px 이후 아래로 스크롤할 때 Div를 표시하고 위로 스크롤할 때 숨기는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!