要判断页面滚动条是否到底,需要了解三个属性:

scrollHeight:获取元素内容高度的度量,包括由于溢出导致的视图中不可见内容,说直白点,算上了滚动条不可见的那部分高度。

clientHeight:一般使用document.documentElement.clientHeight获取可视窗口高度,不包括溢出不可见高度。

scrollTop:滚动条具体可视窗口顶部的高度。

1.判断滚动条是否到底部:

element.scrollHeight - element.scrollTop === element.clientHeight
2.判断是否有滚动条:
element.scrollHeight > element.clientHeight ? 有滚动条 :无滚动条

JS判断滚动条到底部,页面是否有滚动条的更多相关文章

  1. JS判断是否是微信页面,判断手机操作系统(ios或android)并跳转到不同下载页面

    JS判断客户端是否是iOS或者Android 参考:http://caibaojian.com/browser-ios-or-android.html function is_weixin() { v ...

  2. JS判断是否已经到达页面底部

    $(window).scroll(function(){ var scrollTop=$(this).scrollTop(); var scrollHeight=$(document).height( ...

  3. js判断加载大小页面

    大页面里的js: <script> function jmp(){ var w = document.body.clientWidth; if( w > window.screen. ...

  4. js 判断 是否在当前页面 当前页面是否在前端

    1.使用visibilitychange 浏览器标签页被隐藏或显示的时候会触发visibilitychange事件. document.addEventListener("visibilit ...

  5. HTML JS 弹层后底部页面禁止滚动处理

    1.打开新页面时需要禁止鼠标滚轮,禁止页面滑动: 1 2 3 4 在调用显示层时加上这句js代码就可以了: document.documentElement.style.overflow = &quo ...

  6. js 判断 是否在当前页面

    1.使用visibilitychange 浏览器标签页被隐藏或显示的时候会触发visibilitychange事件. document.addEventListener("visibilit ...

  7. js判断滚动条是否已到页面最底部或顶部实例

    原文 本文实例讲述了js判断滚动条是否已到页面最底部或顶部的方法.分享给大家供大家参考.具体分析如下: 我们经常会看到很多的网站一个返回顶部效果就是当我们滚动条到指定位置时返回顶部出来了,否则就自动隐 ...

  8. 判断滚动条到底部的JS代码

    这篇文章介绍了判断滚动条到底部的JS代码,有需要的朋友可以参考一下 判断滚动条到底部,需要用到DOM的三个属性值,即scrollTop.clientHeight.scrollHeight. scrol ...

  9. 通过 JS 判断页面是否有滚动条的简单方法

    前言 最近在写插件的过程中,需要使用 JS 判断是否有滚动条,搜了一下,大致方法都差不多,但都有些啰嗦,代码不够简洁.最终通过参考不同方法,写了一个比较简单的方法.在判断滚动条的同时也需要计算滚动条的 ...

  10. JS判断页面是否出现滚动条

    今天无聊,帮一个网友解决一个很无聊的问题,用JS判断页面是否出现滚动条,在网上看了一些代码,经过验证并不起作用,下面是在网上搜索到的代码: 当可视区域小于页面的实际高度时,判定为出现滚动条,即: if ...

随机推荐

  1. SpringMVC对静态资源的访问(js、css、img)

    在网上找了很多的内容,都没法解决,最后通过https://blog.csdn.net/wild46cat/article/details/52456715中内容解决的,在此记录一下. 项目结构: po ...

  2. JavaScript基础视频教程总结(091-100章)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 记一次bash脚本开发的经历

    现状描述与需求描述 最近梳理系统功能的时候发现现在每个月处理完数据之后,需要给别的系统传送批接口文件,接口文件的内容是来自于Oracle数据表中的数据.我每次都需要手工执行一下存储过程,让数据从正式表 ...

  4. gii配置

    下载完成后不要设置urlManager http://zjm.testyii.com/index.php?r=gii 即可进入gii页面 或者是 将'urlManager'=> [ 'enabl ...

  5. java实现中缀表达式转后缀表达式

    package postfix; import java.util.Stack; /** * * @author DELL 将中缀表达式转化为后缀表达式 */ public class Express ...

  6. Python之旅Day4 闭包函数 模块及模块倒入

    闭包函数 闭包函数就是在内部函数当中有对外部函数名字的引用 ###代码示例1### def f1(): x =1 def f2(): print(x) return f2 f=f1() f() ### ...

  7. 关于opengl的ActiveTexture以及bindXxx函数的分析

    1.GLBindxxx,意思就是,将xxx指定为当前对象,之后的操作都是针对这个xxx进行. 比如,GLBindBuffer(bufferTarget, bufferId),就是指定bufferid和 ...

  8. Nerd的畅销产品

    感谢陈大先生花费时间一起细致地讨论这个课题,促成此文. <Nerd的套现ATM机>中已经谈到,对于nerd来讲最畅销的产品是“考试通过”.本文将继续这个话题的展开讨论,更深入细致地分析这个 ...

  9. python 字符串拼接

    str1 = 'abc' str2 = 'def' str3 = str1 + str2 print(str3) 这种方法只需要申请一次内存.

  10. 二、activiti工作流-创建25张表

    首先我们在eclipse上创建一个maven项目 然后在resources下面创建一个file,并命名问activiti.cfg.xml activiti.cfg.xml的配置内容如下 <?xm ...