Home  >  Article  >  Web Front-end  >  Simple example based on scroll bar position judgment_javascript skills

Simple example based on scroll bar position judgment_javascript skills

韦小宝
韦小宝Original
2017-12-16 09:19:331483browse

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()


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!

Statement:
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