.onscroll jquery不能在火狐工作

我很新的编码，并有一个基本的知识。我正在做一个简单的单页网站，并使用了一点jquery使顶部的导航条只出现在滚动页面的顶部元素（'着陆页'）之后才出现 - 为了让一个清洁工'登陆页面'。.onscroll jquery不能在火狐工作

（我用这个方法来代替滚动过去固定的像素值，因为它需要通过时，媒体查询触发适应网站的移动版本）

这精美的作品，直到我尝试它在Firefox中 - 然后没有任何反应。现在完全失去。

下面是我通过计算器找到的原始代码，并稍作修改。

谢谢你提前！

window.onscroll = function (oEvent) { 
 
    var mydivpos = document.getElementById("intro").offsetTop; 
 
    var scrollPos = document.getElementsByTagName("body")[0].scrollTop; 
 
    
 
    if(scrollPos >= mydivpos) 
 
    document.getElementById("bottomMenu").className = ""; 
 
    else 
 
    document.getElementById("bottomMenu").className = "hidden"; 
 
};

#bottomMenu { 
 
    position: fixed; 
 
    top: 0px; 
 
    left: 0px; 
 
    width: 100%; 
 
    height: 64px; 
 
    border: 4px solid #000; 
 
    background: white; 
 
    z-index: 100; 
 
} 
 

 

 

 
.hidden { 
 
    display: none; 
 
}

<!DOCTYPE html> 
 

 
<html> 
 
<head> 
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
 
<meta charset=utf-8 /> 
 
<title>test</title> 
 
<style id="jsbin-css"> 
 

 
</style> 
 
</head> 
 
<body> 
 
    
 
    <div id="bottomMenu" class="hidden">HELLO</div> 
 
    a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br /> 
 
    <div id="intro">MYDIV</div> 
 
    a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br /> 
 
    
 
    
 
</body> 
 
</html>

来源

2016-04-24 phillip

我相信document.getElementsByTagName（ “身体”）[0] .scrollTop（或的document.body.scrollTop）已被弃用，但有些浏览器仍依赖于它。

var scrollPos = document.getElementsByTagName("body")[0].scrollTop;

要这样：

var scrollPos = document.documentElement.scrollTop;

但后来它不能在Chrome中使用了，如果你改变这一行

您的解决方案正常工作的Firefox。所以，你需要这样做：

var scrollPos = document.documentElement.scrollTop || document.body.scrollTop;

这里是一个小提琴：https://jsfiddle.net/willemo/fyury33p/2/

来源

2016-04-25 15:28:07 willem

.onscroll jquery不能在火狐工作

回答

相关问题