js滚动条滚动到底部和顶部

Posted 2020-10-11 逗比煎饼侠

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js滚动条滚动到底部和顶部相关的知识，希望对你有一定的参考价值。

<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.scrolldiv{
width: 500px;
height: 400px;
margin: 1000px auto 100px auto;
background: #f00;
}
</style>
</head>
<body>
<div class="scrolldiv"></div>
<script type="text/javascript">
function scrollBottomOrTop(){
var clients=window.innerHeight || document.documentElement.clientHeight||document.body.clientHeight;
var scrollTop=document.body.scrollTop;
var wholeHeight=document.body.scrollHeight;
if(clients+scrollTop>=wholeHeight){
alert(‘我到底部了‘);
}
if(scrollTop==0){
alert(‘我到顶部了‘);
}
}
window.onscroll=scrollBottomOrTop;
</script>
</body>
</html>

以上是关于js滚动条滚动到底部和顶部的主要内容，如果未能解决你的问题，请参考以下文章