jquery - Forcing footer to bottom of page, if document height is smaller than window height -
i'm working on fixing display of website in ipad's portrait mode. issue page length isn't long ipad's portrait display. here pic of i'm talking about:

i created jquery function thought detect when document height isn't big window height, set position of footer fixed. here code:
if ($(document).height() < $(window).height()) { $('#footer-wrapper').attr('style', 'position: fixed!important; bottom: 0px;'); } current css:
#footer-wrapper { padding: 20px 0px 23px; background-color: #e3e9dc; border-bottom: 3px solid #007897; border-top: 3px solid #007897; color: #585858; position: absolute; bottom: 0px; left: 0px; width: 100%; text-align: center; } @media screen , (max-width: 1024px) { #footer-wrapper { /*padding: 20px 0px 23px;*/ background-color: #e3e9dc; border-bottom: 3px solid #007897; border-top: 3px solid #007897; color: #585858; position: relative; margin-bottom: -65px!important; width: 100%; text-align: center; } } i think work, reason document saying height bigger window viewport, if statement isn't executed. know more reliable way of achieving this?
simply change javascript to:
if ($(document.body).height() < $(window).height()) { $('#footer-wrapper').attr('style', 'position: fixed!important; bottom: 0px;'); }
Comments
Post a Comment