JS如何判断浏览器滚动条的位置

我需要右则滚动条滚动到距离底部特定距离时,(例如只剩20%时),触发一个function.请问怎样可以判断右则滚动条距离底部的距离.我网上查了很多,都只有距离顶部的,也有... 我需要右则滚动条滚动到距离底部特定距离时,(例如只剩20%时),触发一个function.

请问怎样可以判断右则滚动条距离底部的距离.

我网上查了很多,都只有距离顶部的,也有整条滚动条的长度,但如果要知道距离底部的距离,还需要知道滑块的高度才能相减得到,但我找了很久都没有获取滑块高度的代码

或者有没有其他更好的方法来得知距离底部的距离????? 展开

 我来答

3个回答

#热议# 生活中有哪些实用的心理学知识？

li1987326
2012-04-12

知道答主

回答量：9

采纳率：0%

帮助的人：14.4万

我也去答题访问个人页

关注

展开全部

可以这么试一下
在你的页面上某个位置放一个div或者就用你页面上已有的某个元素也行，当用户滚动的时候这个div相对于浏览器的顶部或底部的距离肯定会变化，然后你通过这个距离来判断用户浏览到当前页面的什么位置了。

参考一下，我没试过....

追问

那怎样判断那个DIV距离底部的距离...

追答



function a(){
                var st = document.documentElement.scrollTop;//滚去的高度
                var ch = document.documentElement.clientHeight;//窗口的高度
                var at = document.getElementById("a").offsetTop;//元素离页面顶部的高度
                var v = ch - (at - st);//元素离窗口底部的高度,为负的话表示元素还在窗口底部下面
                alert("距离底部的高度为:"+v);
            }

testtesttesttesttesttesttesttesttesttesttesttest
            testtesttesttesttesttesttesttesttesttesttesttest
            testtesttesttesttesttesttesttesttesttesttesttest
            testtesttesttesttesttesttesttesttesttesttesttest
            testtesttesttesttesttesttesttesttesttesttesttest
            
            testtesttesttesttesttesttesttesttesttesttesttest

已赞过 已踩过<

评论收起

绿衣人敲门
2015-10-27 · 知道合伙人软件行家

绿衣人敲门
知道合伙人软件行家

采纳数：18765 获赞数：63773

毕业于西北大学计算机网络技术专业，现在在西安电力学院进行网络推广维护工作！

向TA提问私信TA

关注

展开全部

onload=function(){
var changeBG=0,scrollTop=0;
//设置原始变量
setInterval(function(){
scrollTop=document.body.scrollTop
if(changeBG&&scrollTop>200){
//判断是否更换了背景及滚动条是否到达指定高度
document.body.scrollTop=0; //转到页面顶部
document.body.style.backgroundImage="url(...)";
//变换背景
changeBG=1;
//表示已经转换了背景
setTimeout(function(){
document.body.scrollTop=changeBG
//返回原来位置
},1000)

}
},1000)
}

已赞过 已踩过<

评论收起

圣鸾OJ
2015-10-07 · TA获得超过1629个赞

知道小有建树答主

回答量：1136

采纳率：96%

帮助的人：112万

我也去答题访问个人页

关注

展开全部

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function a(){
var st = document.documentElement.scrollTop;//滚去的高度
var ch = document.documentElement.clientHeight;//窗口的高度
var at = document.getElementById("a").offsetTop;//元素离页面顶部的高度
var v = ch - (at - st);//元素离窗口底部的高度,为负的话表示元素还在窗口底部下面
alert("距离底部的高度为:"+v);
}
</script>
</head>
<body>
<div>
test test test test test test test test test test test test <input type="button" value="test" onclick="a()"/>
test test test test test test test test test test test test <input type="button" value="test" onclick="a()"/>
test test test test test test test test test test test test <input type="button" value="test" onclick="a()"/>
test test test test test test test test test test test test <input type="button" value="test" onclick="a()"/>
test test test test test test test test test test test test <input type="button" value="test" onclick="a()"/>
<div id="a" style="width:100px;height:1px;background-color: red"></div>
test test test test test test test test test test test test <input type="button" value="test" onclick="a()"/>
</div>
</body>
</html>

已赞过 已踩过<

评论收起

更多回答（1）

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

JS如何判断浏览器滚动条的位置

其他类似问题

为你推荐：