스크롤값, 윈도우 높이, 문서 높이 구하기
HTML,CSS,JAVASCRIPT

스크롤값, 윈도우 높이, 문서 높이 구하기

제이쿼리로 스크롤값, 윈도우 높이, 문서 높이 구하는 방법

    $(window).scroll(function() {


  let 윈도우 스크롤  값 =   $(window).scrollTop();

  let 문서 스크롤 값   $(document).scrollTop();

  let 윈도우 높이 값      $(window).height();

  let 문서 높이 값        $(document).height(); 
          
    });

 

 

윈도우 스크롤과 문서 스크롤 값은 동일함  아무거나 쓰자

윈도우 스크롤(문서) + 윈도우 높이 값은 = 문서 높이와 동일하다

위의 공식을 사용해서 

 

if($(window).scrollTop() + $(window).height() = $(document).height()  ) {



  $('# ).addClass('.');  



}

else{

$('#k').removeClass('move_Top_Out2').addClass('move_Top_In2');

}

 

스크롤을 문서 최 하단까지 내렸을때 동작하는 함수를 만들 수 있다

 

 

    $(window).scroll(function() {
        if($(window).scrollTop() + $(window).height() > $(document).height() - 300 ) {
            $('#left').addClass('hidetoggle');
            $('.mbi-simpletalk-kakao').fadeOut(500);
            $('#bottom , .ec-base-lookbook').removeClass('move_Top_Out2').addClass('move_Top_In2');
        } else {
            $('#left').removeClass('hidetoggle');
            $('.mbi-simpletalk-kakao').fadeIn(500);
            $('#bottom , .ec-base-lookbook').removeClass('move_Top_In2').addClass('move_Top_Out2');   
        }    
    });


    위에 코드는 문서의 최하단에서 위로 300의 값을 기준으로 클래스를 추가하고 제거 하는 함수이다