jQueryを使用して画面の下部にフッターを保存する方法

Question

jQueryを使用してフッターを画面の下部に保存する方法。

私はcssでその複製を知っていますが、どのようにjQueryでそれを行いますか？

CSSを使用する他のソリューションでは、画面のサイズが異なり（小さな画面）、別のHTMLコードで多くの問題が発生しました。

たとえば、このソリューションは、CSSを使用して、私のために動作しません：

How to keep footer at bottom of screen

CSS to make HTML page footer stay at bottom of the page with a minimum height

私は自分のデザインコードを持っているし、新しいスタイルや構造ができませんのでご注意ください問題の修正を手伝ってください。

Answer 1

シンプルで簡単です。

次のコードをフッターの前またはストレッチしたい場所にコピーして貼り付けてください。

<div id="js-heightControl" style="height: 0;">&nbsp;</div> 
<script> 
    $(function(){ 
     $('#js-heightControl').css('height', $(window).height() - $('html').height() +'px'); 
    }); 
</script> 

Answer 2

CSS：

html { 
    position: relative; 
    min-height: 100%; 
} 
footer { 
    display:none; 
    position: absolute; 
    left: 0; 
    bottom: 0; 
    height: auto; 
    width: 100%; 
} 

のjQuery：

function footerAlign() { 
    $('footer').css('display', 'block'); 
    $('footer').css('height', 'auto'); 
    var footerHeight = $('footer').outerHeight(); 
    $('body').css('padding-bottom', footerHeight); 
    $('footer').css('height', footerHeight); 
} 


$(document).ready(function(){ 
    footerAlign(); 
}); 

$(window).resize(function() { 
    footerAlign(); 
}); 

DEMO：http://codepen.io/anon/pen/ZQxQoR