jquery - CSS 或 jQuery 将 div 定位在视口(viewport)底部

Question

请帮我修复内容底部的两个卡通人物

CSS 现在可以工作了:- 按照建议固定位置底部:http://plungjan.name/test4.html

---

jQuery: http://plungjan.name/test2.html

似乎我没有正确计算它们应该在哪里。

或者纯 CSS 的建议会很好，因为在这种情况下我只使用 jQuery 来做定位这件事。

请注意它们有两个，所以我不认为我可以使用页脚胶水或 footerpush 或任何它叫什么。

  $(document).ready(function(){

     var footerHeight = 0,
         docHeight,
         footerTop = 0,
         $footer = $(".child");

     positionFooter();

     function positionFooter() {

       footerHeight = $footer.height();
       footerTop = ($("#contentcontainer").height()-footerHeight-45)+"px";
/*
      docHeight=$(document).height();
       if (footerTop > (docHeight-footerHeight)) {
         alert("using "+docHeight +" instead of "+footerTop)
         footerTop = (docHeight-footerHeight)+"px";
       } */

       $footer.animate({top: footerTop})
     }
     // $(window).scroll(positionFooter).resize(positionFooter)
  });

Answer 1

你为什么不简单地使用

#boy1, #girl1 {
    bottom: 0
}

代替？

更新，更具体地说:首先转到您的global_styles.css 文件。一个用于 http://plungjan.name/test2.html .替换

#girl1 {
    position: absolute;
    left: -95px;
    top: 170px;
    z-index: 1;
}

与

#girl1 {
    position: absolute;
    left: -95px;
    bottom: 0;
    z-index: 1;
}

和

#boy1 {
    position: absolute;
    left: 885px;
    top: 175px;
    z-index: 1;
}

与

#boy1 {
    position: absolute;
    left: 885px;
    bottom: 0;
    z-index: 1;
}

不要应用position: fixed。