Home > Web Front-end > JS Tutorial > body text

How to use scroll bar position judgment

亚连
Release: 2018-06-20 16:33:32
Original
2378 people have browsed it

The editor below will share with you a simple example based on scroll bar position judgment. It has a good reference value and I hope it will be helpful to everyone. Let’s follow the editor to take a look.

The example is as follows:

//获取滚动条距离顶部位置
function getScrollTop() {
 var scrollTop = 0;
 if (document.documentElement && document.documentElement.scrollTop) {
  scrollTop = document.documentElement.scrollTop;
 } else if (document.body) {
  scrollTop = document.body.scrollTop;
 }
 return scrollTop;
}
//获取当前可视范围的高度
function getClientHeight() {
 var clientHeight = 0;
 if (document.body.clientHeight && document.documentElement.clientHeight) {
  clientHeight = Math.min(document.body.clientHeight, document.documentElement.clientHeight);
 } else {
  clientHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight);
 }
 return clientHeight;
}
//获取文档完整的高度
function getScrollHeight() {
 return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
}
//判断滚动条是否达到底部
getScrollTop() + getClientHeight() == getScrollHeight()
Copy after login

The above is what I compiled for everyone. I hope it will be useful to you in the future. Everyone is helpful.

Related articles:

How to use the Node layer to implement multipart form file upload

How to use React to encapsulate Portal reusable components

How to send requests to the intermediate service layer in node (detailed tutorial)

How to get Excel content in Node

How to use jQuery to solve the problem that dynamically added elements cannot trigger binding events

How to use Node to configure files (detailed tutorial)

Usage How jQuery implements mobile phone number regular verification input

How to implement the jump function in AngularJS

How to implement the drag and drop function in AngularJS

How to implement a chat room using socket.io

The above is the detailed content of How to use scroll bar position judgment. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template