2016-07-11 4 views
4

jQuery 플러그인에 문제가 있습니다. 페이지 끝 부분에 특정 방법으로 꼬리말을 표시하고 싶습니다. 이를 위해 실제 바닥 위치를 얻고 전신 높이와 비교합니다.jQuery로 문서의 실제 높이 얻기

하지만 jQuery 함수의 height()가 잘못된 값을 반환하는 문제가 있습니다. 예를 들어 사이트의 높이가 5515px이지만 함수가 나에게 값을 반환한다는 것을 알고 있습니다. 8142px

페이지의 몇 군데에서 mCustomScrollbar 플러그인을 사용하는데 문제가 발생할 수 있습니다. 페이지가보기 좋도록 요소를 가지고 있기 때문에 사용할 수 없습니다.

내 코드 : 토미 리오 단에 응답

(function($){ 
    $.fn.scrollingElements = function(){ 
     var height = $(window).height(); 
     var max_height = $(document).height(); 
     var prev_top = $(window).scrollTop(); 
     var prev_bottom = top + height; 
     $(window).scroll(function(){ 
      var top = $(window).scrollTop(); 
      var bottom = top + height; 

      console.log(max_height, bottom); 

      if(prev_top < height && top > height){ 
       // console.log('show header', 'show sticky', 'show footer small'); 
      } 
      if(prev_top > height && top < height){ 
       // console.log('hide header', 'hide sticky', 'hide footer'); 
      } 
      if(prev_top < 2*height && top > 2*height){ 
       // console.log('show sroll top'); 
      } 
      if(prev_top > 2*height && top < 2*height){ 
       // console.log('hide scroll top'); 
      } 

      if(prev_bottom < max_height - 100 && bottom > max_height - 100){ 
       // console.log('show footer large'); 
      } 
      if(prev_bottom > max_height - 100 && bottom < max_height - 100){ 
       // console.log('show footer small'); 
      } 

      prev_top = top; 
      prev_bottom = bottom; 

     }); 
     $(window).resize(function(){ 
      height = $(window).height(); 
     }); 
    } 
})(jQuery); 

: 변경 $ (문서) .height의() document.body.clientHeight에 여전히 점점 나쁜 결과를 작동하지 않았다. 동일한 효과를 사용하여 $ ('body'). height()를 사용하여 시도했습니다.

+6

왜 'position : fixed; 하단 : 0' CSS에서 이렇게 할? –

+0

수동으로 결과 높이 빼기 ... –

+0

로리, 안돼, 보헤미라, 너 무슨 뜻이야? 페이지에 수동으로 배치 할 수없는 동적 인 높이가 있습니다. – Manveru

답변

0

사용하십시오

문서

대신 창 예를 들어 :

$ (창) .resize (함수() { 높이 = $ (문서). 높이(); });