使用下拉加载

使用需要引用的css

<link rel="stylesheet" href="../dist/dropload.css">

使用需要引用的js

<!-- jQuery1.7以上 或者 Zepto 二选一，不要同时都引用 -->
<script src="js/zepto.min.js"></script>
<script src="../dist/dropload.min.js"></script>

使用方法：网上有很多再次就不展开了

主要记录一下bug以及修改

1.bug：刚进去页面的时候出现上拉加载字样，然后上拉页面才会出现加载中...

理想效果：刚进来页面直接是加载中...字样

bug原因以及修改：原因是给本区域的最外层div设置了高度，把设置的高度去掉就可以了。还有一个原因可能是提前加载距离threshold:50   数字可以大一点，修改为100。

2.由于部分Android中UC和QQ浏览器头部有地址栏，并且一开始滑动页面隐藏地址栏时，无法触发scroll和resize，所以会导致部分情况无法使用。

解决方案1：增加distance距离，例如DEMO2中distance:50；

解决方案2：加meta使之全屏显示

<meta name="full-screen" content="yes">
<meta name="x5-fullscreen" content="true">

 

下拉加载dropload.js的更多相关文章

  1. 手机网站下拉加载数据js(简单版)

    加载内容的地方html <div class="bgcolor_f0 clearfix"> <div class="recharge"> ...

  2. dropload.js下拉加载更多

    项目中有用到下拉加载更多的地方,去网上找了一个插件,地址:http://ons.me/526.html总体还是不错的,可能自己不是特别了解这个插件,做项目时,也是遇到了无数问题.项目中要用的是两个ta ...

  3. 移动端好用的下拉加载上拉刷新插件 dropload插件

    入了很多下拉加载上拉刷新的插件,但是感觉都不好用,知道最近遇到这款dropload的插件,瞬间打开新世界的大门啊,无卡顿简单易用可配置 <!doctype html> <html&g ...

  4. 原生JS下拉加载插件分享。

    无聊写了一个JS下拉加载插件,有需要的可以下载. // 使用 // new ManDownLoad("#ul","json/load.json",functio ...

  5. 移动端下拉刷新上拉加载-mescroll.js插件

    最近无意间看到有这么一个上拉刷新下拉加载的插件 -- mescroll.js,个人感觉挺好用的,官网地址是:http://www.mescroll.com 然后我就看了一下文档,简单的写了一个小dem ...

  6. iscroll.js实现上拉刷新，下拉加载更多，应用技巧项目实战

    上拉刷新,下拉加载更多...仿原生的效果----iscroll是一款做滚动效果的插件,具体介绍我就不废话,看官方文档,我只写下我项目开发的一些用到的用法: (如果不好使,调试你的css,想必是个很蛋疼 ...

  7. 下拉加载更多DEMO(js实现)

    项目的一个前端页面展示已购买商品时,要求能下拉加载更多.花了点时间研究这个功能,以前没做过. 首先需要给div加scroll事件,监听滚动条滚动动作.那何时触发加载动作呢?当滚动条滚到底的时候.如何判 ...

  8. js 下拉加载

    // 下拉加载    var clientHeight = $(window).height() //当前可视的页面高度    console.log(clientHeight) //滚动条到页面底部 ...

  9. H5页面下拉加载更多(实用版)

    近期在做一个H5网站,需要下拉加载更多产品列表的功能.百度搜索了好久,什么说法都有,什么插件都有.   醉了.基本上每一个能直接拿来用的. 最后发现: 1.dropload.js 插件  还可以,但是 ...

随机推荐

  1. C#数组的定义，不定长的数组？

    首先,在这里我要说明的是,C#中,定义了数组,那么就必须为其指定长度,且他的长度确定,不能够更改.一旦定义一个数组,那么操作系统就在内存中给这个数组指定了一块内存,他是不支持动态分配存储空间的.能够动 ...

  2. Android 为库(library)创建不同编译环境

    项目中需要导入库,一般有两种情况,一种是直接路径导入,一种是导入库的 aar 文件. 1. 设置库项目 1. 在库项目的 src 目录下设置 debug 目录,里面可以添加代码或者 res 文件夹. ...

  3. Restful认识和 IK分词器的使用

    什么是Restful风格 Restful是一种面向资源的架构风格,可以简单理解为:使用URL定位资源,用HTTP动词(GET,POST,DELETE,PUT)描述操作. 使用Restful的好处: 透 ...

  4. Ubuntu16.04 - 安装RabbitVCS，linux下的TortoiseSVN！！！

    RabbitVCS 官网:http://rabbitvcs.org/ 1,添加PPA源.在shell里面执行下面命令: sudo add-apt-repository ppa:rabbitvcs/pp ...

  5. Java并发编程之happens-before

    happens-before是JMM最核心的概念,理解happens-before是理解JMM的关键. 一.JMM的设计 首先,让我们先分析一下JMM的设计意图.从JMM的设计者的角度,在设计JMM的 ...

  6. git小白使用教程（一）

    本文所涉及命令基本可以涵盖日常开发场景, 对于开发者平时很少使用的命令不再列举,这样不至于让刚刚使用git的小伙伴们看的脑袋大...如有特殊使用可以联系我单独回复. 首先通过一张图了解git的工作流程 ...

  7. JS: 防抖节流

    防抖节流 防抖(debounce) 先来看看下面的代码: //触发滚动事件,num 就加1 let num = 0; function incNum() { console.log('鼠标滚动中'); ...

  8. Windows server 2008 R2 安装AD域证书

    参考文档: http://blog.51cto.com/gaowenlong/1969585 http://blog.51cto.com/gaowenlong/1969586 安装后打开证书颁发机构 ...

  9. 实践详细篇-Windows下使用Caffe训练自己的Caffemodel数据集并进行图像分类

    三:使用Caffe训练Caffemodel并进行图像分类 上一篇记录的是如何使用别人训练好的MNIST数据做训练测试.上手操作一边后大致了解了配置文件属性.这一篇记录如何使用自己准备的图片素材做图像分 ...

  10. Spring Security构建Rest服务-0400-使用切片拦截rest服务

    Restful API的拦截: 1,过滤器(Filter) 2,拦截器(Interceptor) 3,切片(Aspect) 1,过滤器 和传统javaweb一鸟样,例,记录controller执行时间 ...