Rails 4和基础5 -粘脚

Question

所以我一直在使用静态页面，直到我决定迁移到Rails用于我的web应用程序。

我可以用下面的代码有效地创建一个粘性页脚:

http://codepen.io/aetles/pen/jAdzw

$(function(){ $(document).foundation(); });
window.onload = function() {
  stickyFooter();
};
function checkForDOMChange() {
  stickyFooter();
}
//check for resize event if not IE 9 or greater
window.onresize = function() {
  stickyFooter();
}
//lets get the marginTop for the <footer>
function getCSS(element, property) {
  var elem = document.getElementsByTagName(element)[0];
  var css = null;
  if (elem.currentStyle) {
    css = elem.currentStyle[property];
  } else if (window.getComputedStyle) {
  css = document.defaultView.getComputedStyle(elem, null).
  getPropertyValue(property);
  }
  return css;
}
function stickyFooter() {
  console.log("sticky footer is firing");
  if (document.getElementsByTagName("footer")[0].getAttribute("style") != null) {
    document.getElementsByTagName("footer")[0].removeAttribute("style");
  } 
  if (window.innerHeight != document.body.offsetHeight) {
    var offset = window.innerHeight - document.body.offsetHeight;
    var current = getCSS("footer", "margin-top");
    if (isNaN(current) == true) {
      document.getElementsByTagName("footer")[0].setAttribute("style","margin-top:0px;");
      current = 0;
    } else {
      current = parseInt(current);
    }
    if (current+offset > parseInt(getCSS("footer", "margin-top"))) {      
      document.getElementsByTagName("footer")[0].setAttribute("style","margin-top:"+(current+offset)+"px;");
    }
  }
}

然而，当我使用Rails将其部署到实时应用程序中时，事件本身被触发(我使用console.log消息进行测试)，但它实际上并不编辑页脚的位置。

(视图控制台在下面的页面)https://still平原- 7660. - herokuapp.com/

因为我使用局部页脚本身，可能是Rails不知道实际移动什么?呈现页面上的源代码看起来应该是这样的。

是否有一个更优雅的宝石或解决方案，我可以利用有一个粘脚，不有一个固定的高度?(我需要它响应)。

考虑到它在静态页面上工作得很好，我确信有一些东西我可以调整，但我似乎不明白为什么它不会坚持在Rails部署

Answer 1

我不记得当我使用Foundation创建粘性页脚时我到底做了什么。但我想我找到了一些解决办法。

• https://github.com/coreysyms/foundationStickyFooter
• http://foundation.zurb.com/forum/posts/629-sticky-footer