Javascript jQuery将页脚粘贴到页面底部_Javascript_Jquery_Css

Javascript jQuery将页脚粘贴到页面底部

javascript jquery css

Javascript jQuery将页脚粘贴到页面底部,javascript,jquery,css,Javascript,Jquery,Css,我花了很长时间试图使用CSS将我的页脚粘贴到页面底部，但我几乎放弃了我想要的是，如果视口的高度小于HTML文档的高度，则页脚没有指定额外的CSS属性如果文档高度小于窗口高度，我希望将以下CSS分配给div#thefooter： position: fixed; bottom: 0px; margin-left: -5px; 这是我的JS代码。它什么也不做，控制台日志什么也不显示 $(document).ready(function(){ $(window).bind("load",

我花了很长时间试图使用CSS将我的页脚粘贴到页面底部，但我几乎放弃了

我想要的是，如果视口的高度小于HTML文档的高度，则页脚没有指定额外的CSS属性

如果文档高度小于窗口高度，我希望将以下CSS分配给div#thefooter：

position: fixed;
bottom: 0px;
margin-left: -5px;

这是我的JS代码。它什么也不做，控制台日志什么也不显示

$(document).ready(function(){

  $(window).bind("load", function(){ putFooter(); });
  $(window).resize(function(){ putFooter(); });

  function putFooter(){
    var wh = $(window).height();
    var dh = $(document).height();
    if(dh < wh) {
      $("#thefooter").css({"position": "fixed", "bottom": "0px", "margin-left": "-5px"});
      }
    }

});

$（文档）.ready（函数（）{
$（window.bind（“load”，function（）{putFooter（）；}）；
$（窗口）.resize（函数（）{putFooter（）；}）；
函数putFooter（）{
var wh=$（window.height（）；
var dh=$（document.height（）；
如果（dh


编辑：下面是我的HTML的外观：
<div id="allexceptfooter">
  <div id="themenu">...</div>
  <div id="actualcontent">...</div>
</div>
<div id="thefooter">...</div>


...
...
...

如果你想看到我的网站是duncannz.com的全部内容，请查看这个，根本不需要javascript
看看这个，根本不需要javascript
使用此技术可以完全避免使用Javascript：
使用此技术可以完全避免使用Javascript：
好的，我知道了。不是CSS，我已经花了很多时间尝试了
但是我已经让jQuery工作了。问题是$（document）.height（）
返回了视口的高度，因为我在CSS中使用了body{height:100%；}
。答案是使用以下HTML：
<body>
<div id="everything">
...
</div>
</body>

和CSS：
.footerissticky{
  position: fixed;
  bottom: 0px;
  width: 870px;
}

好的，我知道了。不是CSS，我已经花了很多时间尝试了
但是我已经让jQuery工作了。问题是$（document）.height（）
返回了视口的高度，因为我在CSS中使用了body{height:100%；}
。答案是使用以下HTML：
<body>
<div id="everything">
...
</div>
</body>

和CSS：
.footerissticky{
  position: fixed;
  bottom: 0px;
  width: 870px;
}

JQuery添加了data position=“fixed”来解决这个问题。在-
中回答，JQuery添加了data position=“fixed”来解决此问题。答案是-
你可以使用一个对象将三个.css（…）
部分组合成一个.css（{“位置”：“固定”，“底部”：“0px”，“左边距”：“-5px”}）
这只是为了给未来一个提示：你可以使用一个对象将三个.css（…）
部分组合成一个.css（{“位置”：“固定”，“底部”：“0px”，“左边距”：“-5px”}）
这只是对未来的一个提示：我也尝试过这个堆，但就是无法让它在我的网站上运行。也许你应该解释一下你的页面有什么，所以你不能使用它。也许是一些HTML代码？在问题中添加了HTML代码。如果你想看到整个网站是www.duncannz.com，我也尝试过这个堆，但是just无法将其用于我的网站。也许你应该解释一下你的页面有什么，这样你就不能使用它。也许是一些HTML代码？在问题中添加了HTML代码。如果你想看到整个内容，网站就是www.duncannz。com@DuncanNZ不要失去希望，在过去多次尝试后，它终于对我起了作用：）@DuncanNZ不要失去希望，它在过去多次尝试后，终于为我工作：）