粘滞页脚创建无限滚动

正是标题所说的！我创建的粘性页脚插件（来自您所有优秀人物的一些慷慨援助）运行良好，但它不断创建这种奇怪的infini滚动效果。粘滞页脚创建无限滚动

不知道这里发生了什么？我很难过，尽管我怀疑jQuery中有些东西我没有足够的知识来解决。

感谢您提供任何帮助！

的Javascript：

jQuery(document).ready(function($){ 

$(window).bind("load", function() { 

     var footerHeight = 0, footerTop = 0, $footer = $("#footer"); 
     positionFooter(); 
     function positionFooter() { 

      footerHeight = $footer.height(); 
      footerTop = ($(window).scrollTop()+$(window).height()-footerHeight)+"px"; 

      if(($(document.body).height()+footerHeight) < $(window).height()) { 
        $footer.css({ position: "absolute"}).animate({ top: footerTop },-1) 
       } else { 
        $footer.css({ position: "static"}) 
       } 
      } 

     $(window).scroll(positionFooter).resize(positionFooter) 

    }); 
});

CSS：

#footer { 
    clear: both; 
    height: 80px; 
    padding: 0 0; 
    background: #315B71; 
    border-top: 8px solid rgb(29, 71, 93); 
    width: 100%; 
}

这里的显示问题小提琴：http://jsfiddle.net/ZxupR/

来源

2013-08-23 LukePatrick

我在Safari上看不到任何滚动问题？ –

设置top值时，你忘了占8像素border-top风格。更改：

footerHeight = $footer.height();

到

footerHeight = $footer.outerHeight();

上线14在jquery.footerstick.js文件。

这使用jQuery的.outerHeight()而不是.height()。

这是工作：http://jsfiddle.net/ZxupR/2/

来源

2013-08-23 00:42:46 Joe

好东西，谢谢你的流畅评论！但是，它在网站上似乎不起作用。我已经在这里指出了我的jQuery的变化，但我仍然没有看到一个解决方案。。。这很奇怪，因为它在小提琴中完美无瑕。对此有何想法？谢谢你在这里的努力！ – LukePatrick

@LukePatrick - 没问题。当我加载您的网站时，我也遇到了同样的问题，只需清除浏览器的缓存即可使用。 – Joe

再次感谢您！这确实很好，只有一个问题：在页面确实比屏幕大的页面上，看起来它将页脚视为“position：fixed;'。任何想法，为什么这可能是？就if语句而言，jQuery对我来说看起来很准确。 [链接]（http://www.kangabloo.com/work/） – LukePatrick

我打开你的网站的Web开发人员模式里面克罗默，您的页脚似乎是绝对位置。每次滚动时都会增加一个增量位置。检查一下。以及仅在达到某个窗口分辨率时才会发生的代码。

来源

2013-08-23 01:22:59

粘滞页脚创建无限滚动

回答

相关问题