scrollTop为滚动条在Y轴上的滚动距离。

clientHeight为内容可视区域的高度。

scrollHeight为内容可视区域的高度加上溢出(滚动)的距离

$(window).scroll(function(){
  var scrollTop = $(this).scrollTop();
  var scrollHeight = $(document).height();
  var windowHeight = $(this).height();
  if(scrollHeight-scrollTop-windowHeight <=300){
//当滚动条滚动到距离底部还有300px的时候加载类容
  }else{
//当滚动条滚动到距离底部大于300px的时候加载类容
}
});

JS实现滚动条滚到页面距离底部300px时执行事件的方法的更多相关文章

  1. 设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示;当页面滚动到起始位置时,头部div出现,底部div隐藏

    设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...

  2. 在Angular.js中的H5页面调用Web api时跨域问题处理

    /// <summary> /// 被请求时 /// 在Angular.js中的H5页面调用Web api时跨域问题处理 /// </summary> /// <para ...

  3. ListView组件中 onEndReached 方法在滚动到距离列表最底部一半时执行

    初次使用ListView,在写列表滚动到最底部自动加载使用到方法onEndReached, 发现: ListView组件中 onEndReached 方法在滚动到距离列表最底部一半时执行, 于是翻看文 ...

  4. js文件需要jsp页面中的div时,此js文件必须在div之后才能获得值,否则获取不到

    js文件需要jsp页面中的div时,此js文件必须在div之后才能获得值,否则获取不到 2.图2的内容为directionkey.js的内容

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

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

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

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

  7. selenium + python 怎样才能滚到页面的底部?

    可以用 execute_script方法来处理这个. 调用原生javascript的API,这样你想滚到哪里就能滚到哪里. 下面的代码演示了如何滚到页面的最下面:   driver.execute_s ...

  8. jQuery判断滚动条滚到页面底部脚本

    原文地址 http://www.111cn.net/wy/jquery/61741.htm

  9. js 判断滚动条是不是在浏览器底部

    http://jingyan.baidu.com/album/86f4a73e91da7837d65269d5.html?picindex=2

随机推荐

  1. 山东意外险风险信息推送V7非车

    <?xml version="1.0" encoding="GBK"?><Packet type="REQUEST" ve ...

  2. printf函数重定向

    printf函数底层会调用fputc函数 /*重定向c库函数printf到USART1*/ int fputc(int ch, FILE *f) { /*发送一个字节数据USART1 */ USART ...

  3. 成功获取并更改中兴F660光猫的超级用户密码解除四台限制

    上次雷雨后更换的中兴的F660光猫还是很不错的,很稳定,不过超级密码确实记不住,找了些资料,今天成功的更改了密码,简要的写出过程以备下次参考: 第一步:获取超级密码(已知用户名telecomadmin ...

  4. Lotus 迁移到Exchange 2010 之准备使用Transport 同步Lotus 相关信息!

    这里我们先来分析下Lotus迁移到Exchange2010 的一些原理,由于存在一定周期的共存时间,因此在共存期间必须来实现相应的同步计划,整个同步计划包含了如下的同步计划:

  5. json操作json类型转换

    前提是需要加Jar包: gson-2.2.2.jar package utils; import java.io.BufferedReader;import java.io.FileInputStre ...

  6. Odoo的Domain (一)

    Odoo 的Domain:多个条件的列表. 条件:(字段名,操作符,值)三元式(列表或者元组) 字段名:当前模型的字段或者是通过点操作符访问的Many2one/Many2Many对象,当是Many2M ...

  7. redis的文件事件处理器

    前言     C10K problem提出了一个问题,如果1w个客户端连接到server上,间歇性的发送消息,有哪些好的方案?     其中的一种方案是,每个线程处理多个客户端,使用异步I/O和就绪通 ...

  8. 根据PID和VID得到USB转串口的串口号

    /******************************************************************************* * * FindAppUART.cpp ...

  9. linux 下使rdate命令支持ipv6 ntp server 同步时间

    如果使用linux 下,busybox自带的rdate命令 去ipv6 的ntp server 同步时间的话,会提示invalid argument :无效参数. 那么现在下载rdate的源码并对其进 ...

  10. Gridview中绑定DropDownList

    1.页面代码                         <asp:TemplateField HeaderText="等级">                   ...