window.addEventListener("scroll", function(event) {

    var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

    console.log(scrollTop);

    if(document.documentElement.scrollHeight ==     document.documentElement.clientHeight + scrollTop ) {

    alert("到底部啦");

}

});

JS 原生JS 判断滚动条滑动到底部的更多相关文章

  1. JS 原生JS 判断滚动条滑动到底部（兼容苹果safari）

    ListenerScoller () { var pageIndex = 1; var startX, startY; document.addEventListener('touchstart',f ...

  2. JS如何判断滚动条是否滚到底部

    判断滚动条到底部,需要用到DOM的三个属性值,即scrollTop.clientHeight.scrollHeight.   scrollTop为滚动条在Y轴上的滚动距离.   clientHeigh ...

  3. JS实现判断滚动条滚到页面底部并执行事件的方法

    需要了解三个dom元素,分别是:clientHeight.offsetHeight.scrollTop. clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那 ...

  4. jquery如何判断滚动条滚到页面底部并执行事件

    首先理解三个dom元素,分别是:clientHeight.offsetHeight.scrollTop. clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那 ...

  5. jquery判断滚动条是否到底部

    clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那个这个高度则是不包括滚动条没显示出来的下面部分的内容.而只是单纯的DIV的高度. offsetHeight ...

  6. js原生封装自定义滚动条

    /* * @Author: dothin前端 * @Date: 2015-11-21 00:12:15 * @Last Modified by: dothin前端 * @Last Modified t ...

  7. js 原生JS实现轮播图

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. jsonrpc.js -- 原生js实现 JSON-RPC 协议

    很早以前就涉及到多端远程调用 api的设计,那时候自己设计了个消息传递回调过程.最近了解了JSON-RPC协议,更正规,就可以自己实现下.逻辑也不复杂,没有限制底层消息传递的方式,可以应用到更多的场景 ...

  9. JQuery 判断滚动条是否到底部

    BottomJumpPage: function () { var scrollTop = $(this).scrollTop(); var scrollHeight = $(document).he ...

随机推荐

  1. 第二百零五节，jQuery EasyUI，Messager(消息窗口)组件

    jQuery EasyUI,Messager(消息窗口)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解 EasyUI 中 Messager(消息窗口)组件的使用方法,这个组 ...

  2. JSP数据库连接成功

    <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding= ...

  3. HTML5 选择前置摄像头，选择后置摄像头

    最近发现我写的都是乱七八糟的,觉得应该给大家带点福利,于是写了这篇 背景:最近想做个web应用,需要用到摄像头,但是发现默认一直是前置摄像头,拍照很麻烦,于是找了很多文章,居然没有人提到,只好FQ去找 ...

  4. Oracle性能监控脚本(sql)

    1. 监控事例的等待 select event,sum(decode(wait_Time,0,0,1)) "Prev", sum(decode(wait_Time,0,1,0)) ...

  5. ReactJS组件之间通信

    http://www.open-open.com/lib/view/open1473838243065.html

  6. Docker入门与应用系列（八）Docker图形界面管理之Shipyard

    Shipyard基于Docker API实现的容器图形管理系统,支持container.images.engine.cluster等功能,可满足我们基本的容器部署需求可堆栈的Docker管理基于Doc ...

  7. .net webapi项目跨域问题及解决方案

    问题: 1.项目完成,部署到不同的iis版本上,跨域访问有的通有的不通 解决办法: 1.将复杂请求改为简单请求 2.代码中去掉所有跨域设置,配置中添加或修改节点 <system.webServe ...

  8. Redis 连接失败redis Can't init enough connections amount!

    Can't init enough connections amount! Only 0 from 10 were initialized. Server: IP:6379 无法初始化足够的连接数量! ...

  9. VMware虚拟机NAT(地址转换模式)

    转载于:https://www.linuxidc.com/Linux/2016-09/135521p2.htm 二.NAT(地址转换模式)   刚刚我们说到,如果你的网络ip资源紧缺,但是你又希望你的 ...

  10. JavaScript实践-简单的贪吃蛇小游戏

    实现逻辑: //获取Html中的格子(行,列) //建立数组存储所有格子(x,y) //建立数组用于存储蛇身(x,y) //生成随机坐标(x,y)的函数 //随机创建蛇身并存储到蛇身数组 //创建食物 ...