바닥 글을 브라우저 창의 아래쪽까지 확장 할 수 없습니다.

Question

그래서이 페이지에서 바닥 글을 가져올 수 없습니다 : http://hiddenhillsweddings.com/ 브라우저 창의 아래쪽까지 확장 할 수 있습니다. 다른 위치 속성 (절대, 상대 등)을 모두 시도 했으므로 100 % 및 기타 값에서 최소 및 최대 높이가 다른 모든 조합을 시도했습니다. 이 주제에 관해이 포럼에서 많은 스레드를 읽었지만 해결책을 찾지 못했습니다. 나는 내가 필요로하는 것이 자세라고 확신한다 : 절대적; 높이를 100 %로 설정했지만 어떤 이유로 브라우저 바닥을지나 확장하는 바닥 글이 스크롤 바를 없애기 위해 오버플로를 숨길 수 없습니다. 누군가 나를 도와주세요.

Answer 1

방금 ​​웹 개발자의 가장 일반적인 문제 중 하나를 발견했습니다. 여기에는 많은 해결책이 있지만, 순수한 CSS와 자바 스크립트가 있습니다. 이미 작성이 주제에 대한 좋은 튜토리얼이 있습니다 http://fortysevenmedia.com/blog/archives/making_your_footer_stay_put_with_css/

http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page

• 내가 개인적으로 jQuery를 통해 그것을 할, 내가 더 신뢰할 수 찾을 수 있습니다. 나는 footer를 display와 함께 모든것 아래에 놓는다 : block과 normal position. 그런 다음 내용이 페이지보다 작은 지 확인합니다.이 경우 위치를 절대 및 하단으로 변경합니다 (0;

  일단 완료되면 시나리오가 변경 될 경우를 대비하여 창 크기를 확인합니다. 아마 최적은 아니지만, 좋은 작품 :

  function footer(){ 
      var offset = $('#footer').offset(); 
      var footerHeight = $('#footer').height(); 
      var height = window.innerHeight; 
      if(height-offset.top-footerHeight>0) 
       $('#footer').css({'position':'absolute', 'bottom':0, 'width':'100%'}); 
      else 
       $('#footer').css({'position':'static'}); 
  } 
  

  그냥 당신이 당신의 바닥 글 요소의 ID를 #footer 변경해야합니다.