zoukankan      html  css  js  c++  java
  • 移动端下拉刷新、加载更多插件dropload.js(基于jQuery/Zepto)[转]

    使用方法

    引用css和js

    <link rel="stylesheet" href="../dist/dropload.min.css">
    <script src="../dist/dropload.min.js"></script>
    $('.element').dropload({
        scrollArea : window,
        loadDownFn : function(me){
            $.ajax({
                type: 'GET',
                url: 'json/more.json',
                dataType: 'json',
                success: function(data){
                    alert(data);
                    // 代码执行后必须重置
                    me.resetload();
                },
                error: function(xhr, type){
                    alert('Ajax error!');
                    me.resetload();
                }
            });
        }
    });

    参数列表

    参数说明默认值可填值
    scrollArea 滑动区域 绑定元素自身 window
    domUp 上方DOM {
    domClass : ‘dropload-up’,
    domRefresh : ‘<div class=”dropload-refresh”>↓下拉刷新</div>’,
    domUpdate : ‘<div class=”dropload-update”>↑释放更新</div>’,
    domLoad : ‘<div class=”dropload-load”>○加载中…</div>’
    }
    数组
    domDown 下方DOM {
    domClass : ‘dropload-down’,
    domRefresh : ‘<div class=”dropload-refresh”>↑上拉加载更多</div>’,
    domUpdate : ‘<div class=”dropload-update”>↓释放加载</div>’,
    domLoad : ‘<div class=”dropload-load”>○加载中…</div>’
    }
    数组
    distance 拉动距离 50 数字
    loadUpFn 上方function function(me){
    //你的代码
    me.resetload();
    }
    loadDownFn 下方function function(me){
    //你的代码
    me.resetload();
    }

    API

    暴露一些功能,可以让dropload更灵活的使用

    lock() 锁定dropload

    unlock() 解锁dropload

    下载地址: http://www.grycheng.com/wp-content/uploads/2015/10/dropload.zip



  • 相关阅读:
    Redis的分布式锁
    Redis的雪崩、击穿、穿透
    psr规范
    Mysql的联(复)合索引
    nginx的location配置(二)
    nginx的location规则(一)
    easyswoole中队列的使用
    第三章 文件I/O
    移动语义及拷贝优化
    PHP对接tdzntech.com云平台电子免费券程序
  • 原文地址:https://www.cnblogs.com/z-e-r-o/p/6212105.html
Copyright © 2011-2022 走看看