网页底部固定的几种方式

####1，判断高度

function footerAuto() {
  var _wh = $(window).height();
  var _dh = $(document).height();
  var _bh = $(document.body).height();
  if (_bh < _wh) {
    $("#footer").css({
      position: "fixed",
      bottom: "0",
      left: "0",
    })
  } else {
    $("#footer").css({
      position: "static",
      bottom: "auto",
      left: "auto",
    })
  }
}

…2，判断滚动条…

function ct() {
  return document.compatMode == "BackCompat" ? document.body.clientHeight : document.documentElement.clientHeight;
}
var f = document.getElementById('footer');
(window.onresize = function() {
  f.style.position = document.body.scrollHeight > ct() ? 'static' : 'fixed';
  f.style.left = "0";
  f.style.bottom = "0";
})();

CSS方法

html { height: 100%; }

body { min-height: 100%; box-sizing: border-box; padding-bottom: 120px; position: relative; }

.footer { width: 100%; height: 120px; line-height: 120px; text-align: center; font-size: 24px; background-color: deeppink; position: absolute; left: 0; bottom: 0; }