2017-02-24 11 views
4

접미사 div가 기본 컨텐트와 창보다 큰 경우 접미사 부트 스트랩에 문제가 있습니다. 내용이 충분한 크기가 아닌 경우 http://jsfiddle.net/d8jzenbr/접미사 div가 컨텐트 및 창보다 크면 접미사 부트 스트랩 문제

var headerHeight = $('header').outerHeight(true);/
var footerHeight = $('footer').outerHeight() + 60; 
$('#account-overview-container').affix({ 
    offset: { 
     top: headerHeight, 
     bottom: footerHeight 
    } 
}).on('affix.bs.affix', function() { // before affix 
}); 

는, 여기에 문제를 참조하십시오 : 충분한 내용이 있기 때문에 여기에

은, 모든 괜찮 http://jsfiddle.net/90m0r91t/은 (접사 정상이 될 때 문제가 접사가)

충분한 콘텐츠가 없을 때 affix div가 정적으로 고정되어 고정되지 않도록 어떻게 수정할 수 있습니까?

문서의 높이, 더 적은 머리글과 바닥 글 높이를 얻을, jQuery를 사용하여 당신에게 .affix-bottom

.affix-bottom{ 
position:absolute /* Comment out this line */ 
} 

답변

0

제거 위치를 감사드립니다. 그런 다음이를 사용하여 접미사에 if 문을 넣습니다.

if(contentHeight > sidebarHeight) { 
    $('#account-overview-container').affix({ 
     offset: { 
      top: headerHeight, 
      bottom: footerHeight 
     } 
    }).on('affix.bs.affix', function() { // before affix 
     $(this).css({ 
      /*'top': headerHeight,*/ // for fixed height 
     }); 
    }) 
} 

DEMO : http://jsfiddle.net/d8jzenbr/6/