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

Simple example based on scroll bar position judgment_javascript skills

韦小宝
Release: 2017-12-16 09:19:33
Original
1516 people have browsed it

The editor below will share with you a simple example based on scroll bar position judgment. The power of JavaScript is obvious to all, so you can learn JavaScript## well. How important # is, friends who are interested in JavaScript, please follow the editor to have 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 simple example based on scroll bar position judgment is all the content shared by the editor. I hope it can To give you a reference, I also hope that everyone will support the PHP Chinese website.

Related recommendations:

js scroll bar multiple styles, recommended_javascript skills

js scroll bar back to top code_javascript skills

js scroll bar smooth movement sample code_javascript skills

The above is the detailed content of Simple example based on scroll bar position judgment_javascript skills. 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
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!