var one = true;//设置一个全局变量
$(window).scroll(function () {
var hight = document.body.scrollHeight - document.body.scrollTop - window.screen.height;//页面往下滚动的时候,定义最底部距离顶部的距离
hight = parseInt(hight);
if(one){//如果one = true继续往下执行
if(hight < window.screen.height){//当页面距离底部还有一屏距离的时候开始加载
one = false;//只能执行一次,加载完成之后再把one定义成true
console.log('继续向下加载');
}
}
});

JS滚动加载的更多相关文章

  1. js 滚动加载iframe框中内容

    var isIE6 = !!window.ActiveXObject&&!window.XMLHttpRequest; //滚动加载 var scrollLoad =function( ...

  2. js滚动加载小插件

    本文实例讲述了jquery滚动加载数据的方法.分享给大家供大家参考.具体分析如下: 少废话直接上代码!!!粗暴,直接,干脆 0//lk-2017-05-04 1(function($, win) { ...

  3. js滚动加载插件

    function $xhyload(o){ var that=this; if(!o){ return; }else{ that.win=$(o.config.obj); that.qpanel=$( ...

  4. 基于 Vue.js 的移动端组件库mint-ui实现无限滚动加载更多

    通过多次爬坑,发现了这些监听滚动来加载更多的组件的共同点, 因为这些加载更多的方法是绑定在需要加载更多的内容的元素上的, 所以是进入页面则直接触发一次,当监听到滚动事件之后,继续加载更多, 所以对于无 ...

  5. JS懒加载

    4.如何使用js懒加载图片       a.懒加载图片是基于jquery.js的,所以: <script src="jquery.js" type="text/ja ...

  6. 记录WEUI中滚动加载的一个BUG

    最近写微信公众号,用到的技术栈是jq+vue的混合开发,采用的UI是移动端比较火的WEUI,在微信开发中应该较广泛.个人看惯了elementUI文档,相对于饿了么组件文档的详细,WEUI的文档还是比较 ...

  7. 潭州课堂25班:Ph201805201 django 项目 第二十二课 文章主页 新闻列表页面滚动加载,轮播图后台实现 (课堂笔记)

    新建static/js/news/index.js文件 ,主要用于向后台发送请求, // 新建static/js/news/index.js文件 $(function () { // 新闻列表功能 l ...

  8. 滚动加载图片(懒加载)实现原理(这是旧实现,仅做为获取元素宽高api的参考)

    https://www.cnblogs.com/flyromance/p/5042187.html 本文主要通过以下几方面来说明懒加载技术的原理,个人前端小菜,有错误请多多指出 一.什么是图片滚动加载 ...

  9. 移动设备的HTML页面中图片实现滚动加载

    如今移动互联网风靡全球,移动页面的元素也是丰富多彩,一个移动页面的图片超过10张已经是再正常不过的事情了.但是相对,很多移动用户还停留在2G,3G这样的网络中.那么这样带宽的用户,在浏览这样的页面时, ...

随机推荐

  1. 1详细解析HTML基础结构

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

  2. mysql 添加登录用户

    一, 创建用户: 命令:CREATE USER 'username'@'host' IDENTIFIED BY 'password'; 说明:username - 你将创建的用户名, host - 指 ...

  3. C#中判断字符串相等的方法

    可以使用如下方式: 1. String.Compare(str1, str2) == 0  或者  str1.CompareTo(str2) == 0 2. str1.Equals(str2)  或者 ...

  4. ER图是啥?

    文章转载自「开发者圆桌」一个关于开发者入门.进阶.踩坑的微信公众号 E-R图也称实体-联系图(Entity Relationship Diagram),提供了表示实体类型.属性和联系的方法,用来描述现 ...

  5. 迷茫<第一篇:初到北京>

    时光如梭,毕业四年了,遥想当年刚毕业的场景就像是昨天发生一样,这四年的人生,就是在不停的漂泊,不断的受挫.感慨良多,一言难以说尽.  2013年11月29号毕业,刚到北京的第二天我就顺利的找到了工作, ...

  6. JAVA反射原理解读

    一.什么是JAVA的反射 1.在运行状态中,对于任意一个类,都能够知道这个类的属性和方法. 2.对于任意一个对象,都能够调用它的任何方法和属性. 这种动态获取信息以及动态调用对象的方法的功能称为JAV ...

  7. ASP渲染下拉框使时间依次减少

    <%    x=year(now())    y=year(now())-1    Do While  y>2002%><li><a href="#201 ...

  8. WeMall的Android app商城中的wemall doraemon代码

    WeMall-Android 包含SMSSDK/WeMall-Client/social_sdk_library_project三个项目以及Api目录下的client.php/update.xml接口 ...

  9. 【NFS项目实战二】NFS共享数据的时时同步推送备份

    [NFS项目实战二]NFS共享数据的时时同步推送备份 标签(空格分隔): Linux服务搭建-陈思齐 ---本教学笔记是本人学习和工作生涯中的摘记整理而成,此为初稿(尚有诸多不完善之处),为原创作品, ...

  10. 机器学习基石 3 Types of Learning

    机器学习基石 3 Types of Learning Learning with Different Output Space Learning with Different Data Label L ...