在firefox浏览器下,scrollTop始终为0的问题

时间:2022-01-29 09:21:52

firefox下,带dtd文档申明:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

的页面不支持document.body.scrollTop,使用document.body.scrollTop来获取滚动值自然就会始终返回0,这就不难解释为什么 firefox下使用jq的方法:$("body").scrollTop()值始终为0啦。符合标准规范的标准写法是:document.documentElement.scrollTop

可以定义一函数来解决这个问题:

<script type=”text/javascript” >
function getScrollXY(){
var x,y;
if(document.body.scrollTop){ //非标准写法,chrome能识别
x=document.body.scrollLeft;
y=document.body.scrollTop;
}
else{ //标准写法
x=document.documentElement.scrollLeft;
y=document.documentElement.scrollTop;
}
return {x:x,y:y};
}

对应的getScrollXY().y就是scrollTop值了!

上面是原生js的处理方法,使用jq完全可以使用下面任一种变通写法:

$("html,body").scrollTop(); //html,body连写,获取scroll值,这种 写法网上比较常见
$(document).scrollTop();
$(window).scrollTop();