Sticky Footer using Jquery and CSS

sticky-footer.css

html {
  position:relative;
  min-height:100%;
  padding-bottom: 30px; /* should be equivalent to footer height */
}
footer {
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  height: 30px; /* can be static height of your footer tag */
}

sticky-footer.js

// Include Jquery before this snippet.
$(document).ready(function(){
	$(window).resize(function(){
	$("html").css("padding-bottom",$("footer").outerHeight())
		
	}),
	$("html").css("padding-bottom",$("footer").outerHeight());
});

@happy2deepak : why have you written $("html").css("padding-bottom",$("footer").outerHeight()); twice ... Is it deliberate or mistake? 😕

One is for resize and other is for page-load event.