{"id":30506430,"url":"https://github.com/dailc/pulltorefresh-h5-iscroll","last_synced_at":"2025-08-25T17:19:34.328Z","repository":{"id":217185808,"uuid":"87499924","full_name":"dailc/pulltorefresh-h5-iscroll","owner":"dailc","description":"基于IScroll5的PullToRefresh实现.。提供多套皮肤机制，便于拓展！","archived":false,"fork":false,"pushed_at":"2017-08-30T03:18:34.000Z","size":1713,"stargazers_count":54,"open_issues_count":1,"forks_count":16,"subscribers_count":5,"default_branch":"master","last_synced_at":"2024-01-15T00:20:31.779Z","etag":null,"topics":["iscroll","iscroll-pull-to-refresh","iscroll5-pull-to-refresh","javascript","pull-down-refresh","pull-to-refresh","pulltorefresh"],"latest_commit_sha":null,"homepage":"https://dailc.github.io/pulltorefresh-h5-iscroll/examples/html","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dailc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2017-04-07T03:20:52.000Z","updated_at":"2024-01-15T00:20:39.080Z","dependencies_parsed_at":"2024-01-15T00:30:53.631Z","dependency_job_id":null,"html_url":"https://github.com/dailc/pulltorefresh-h5-iscroll","commit_stats":null,"previous_names":["dailc/pulltorefresh-h5-iscroll"],"tags_count":0,"template":null,"template_full_name":null,"purl":"pkg:github/dailc/pulltorefresh-h5-iscroll","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dailc%2Fpulltorefresh-h5-iscroll","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dailc%2Fpulltorefresh-h5-iscroll/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dailc%2Fpulltorefresh-h5-iscroll/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dailc%2Fpulltorefresh-h5-iscroll/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dailc","download_url":"https://codeload.github.com/dailc/pulltorefresh-h5-iscroll/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dailc%2Fpulltorefresh-h5-iscroll/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":272100963,"owners_count":24873508,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-25T02:00:12.092Z","response_time":1107,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["iscroll","iscroll-pull-to-refresh","iscroll5-pull-to-refresh","javascript","pull-down-refresh","pull-to-refresh","pulltorefresh"],"created_at":"2025-08-25T17:19:33.755Z","updated_at":"2025-08-25T17:19:34.308Z","avatar_url":"https://github.com/dailc.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## H5下拉刷新皮肤系列\n基于`IScroll`的全套下拉刷新皮肤。各式各样的皮肤。以及下拉刷新实现基类供自定义UI实现。\n\n### Notice\n\n这个老版本的已经不再维护了，后续维护新版下拉刷新\n\n地址:\n\n[https://github.com/minirefresh/minirefresh](https://github.com/minirefresh/minirefresh)\n\n特点：\n\n零依赖（原生JS实现，不依赖于任何库）\n\n多主题，官方提供多种主题（包括默认，applet-仿小程序，drawer3d-3d抽屉效果，taobao-仿淘宝等）\n\n易拓展，三层架构，专门抽取UI层面，方便实现各种的主题，实现一套主题非常方便，并且几乎可以实现任何效果\n\n高性能，良好的兼容性。动画采用css3+硬件加速，在大部分手机上都非常流畅，支持和各种Scroll的嵌套（包括mui scroll,IScroll,Swipe等），支持Vue\n\n优雅的API和源码，API设计科学，简单，源码严谨，所有源码通过ESlint检测，并提供完善的showcase和文档\n\n另外，Npm上也有相应发布。\n\n### Effect(效果)\n\n* 效果1\n![](https://dailc.github.io/pulltorefresh-h5-iscroll/staticresource/img/effect1.gif)\n\n* 效果2\n![](https://dailc.github.io/pulltorefresh-h5-iscroll/staticresource/img/effect2.gif)\n\n* 效果3\n![](https://dailc.github.io/pulltorefresh-h5-iscroll/staticresource/img/effect3.gif)\n\n* 效果4\n![](https://dailc.github.io/pulltorefresh-h5-iscroll/staticresource/img/effect4.gif)\n\n* 效果5\n![](https://dailc.github.io/pulltorefresh-h5-iscroll/staticresource/img/effect5.gif)\n\n* 效果6\n![](https://dailc.github.io/pulltorefresh-h5-iscroll/staticresource/img/effect6.gif)\n\n* 示例页面\n[下拉刷新皮肤示例](https://dailc.github.io/pulltorefresh-h5-iscroll/examples/html/)\n\n### How To Use(使用)\n\n* Require(引入脚本)\n\n\t```\n\t\u003cscript type=\"text/javascript\" src=\"../../../dist/pulltorefresh.skin.default.js\"\u003e\u003c/script\u003e\n\t```\n\t可以将`skin.default`替换为对应的皮肤\n\t\n* HTML Structure(页面结构)\n\n\t```\n\t\u003cdiv class=\"×××-scroll-wrapper\"\u003e\n\t    \u003cdiv class=\"×××-scroll\"\u003e\n\t        ...\n\t    \u003c/div\u003e\n\t\u003c/div\u003e\n\t```\n\t譬如，如果基于mui的，就可以是`mui-scroller-wrapper`，其它的自己定义对应scroll样式即可\n\n* JS Initialization(JS初始化)\n\t\n\t```\n\tvar pullToRefreshObj = new PullToRefreshTools.skin.default({\n\t    // 这里用默认设置\n\t    container: '#pullrefresh',\n\t    // down为null表示不要下拉刷新    \n\t    down: {\n\t        callback: pullDownRefreshCallback,\n\t        // 是否显示成功动画\n\t        isSuccessTips: true,\n\t    },\n\t    // up为null为不要上拉\n\t    // 上拉有关\n\t    up: {\n\t        // 是否自动上拉加载-初始化是是否自动\n\t        auto: true,\n\t\n\t        callback: pullUpRefreshCallback\n\t    },\n\t    scroll: {\n\t        bounceTime: 500,\n\t        // 回弹动画时间\n\t        // 下拉刷新和上拉加载成功动画的时间\n\t        successAnimationTime: 500\n\t    },\n\t});\n\t```\n\t具体可以将`PullToRefreshTools.skin.default`换为其它皮肤，其它更多操作参考示例\n\n* API(暴露出来的方法)\n\n\t```\n\t* finished //这是一个属性，用来控制当前上拉加载是否可用\n\t* refresh() //重置状态。譬如上拉加载关闭后需要手动refresh重置finished状态\n\t* pulldownLoading() //主动触发一个下拉刷新的动画(同时会触发下拉回调)\n\t* pullupLoading() //主动触发一个上拉加载的动画(同时会触发上拉回调)\n\t* endPullDownToRefresh() //关闭下拉刷新动画，重置状态\n\t* endPullUpToRefresh(finished) //关闭上拉加载动画，重置状态，如果finished，则不允许在上拉，除非再次refresh()\n\t```\n\t关于更多的使用说明(如自定义UI类的实现，请参考最后的更多说明)\n\t\n* (Notice)注意\n    * `default`皮肤和`type1`皮肤依赖于`mui.css`\n\t* 其它皮肤依赖于样式文件`pulltorefresh.skin.css`\n\t* 另外，也支持`require`方式引入，`require`后，请通过全局变量方式来使用，如`PullToRefresh.skin.defaults`\n\n* (Global Variable)相应的全局变量与JS文件\n\n\t```\n\tIScroll // 内部的IScroll5保留的全局变量\n\tPullToRefreshTools.core // pulltorefresh.core.js，可以通过这个文件实现自定义皮肤\n\tPullToRefreshTools.skin.defaults // pulltorefresh.skin.default.js 需要和关键字区分\n\tPullToRefreshTools.skin.type1 // pulltorefresh.skin.type1.js\n\tPullToRefreshTools.skin.type2 // pulltorefresh.skin.type2.js\n\tPullToRefreshTools.skin.type3 // pulltorefresh.skin.type3.js\n\tPullToRefreshTools.skin.type4 // pulltorefresh.skin.type4.js\n\tPullToRefreshTools.skin.natives\t// pulltorefresh.skin.native.js 需要和保留字区分\n\tPullToRefreshTools.bizlogic\t// pulltorefresh.bizlogic.implxx.js 系列，依赖于核心下拉刷新文件(随便一个皮肤即可)\n\t```\n\t\n\n### 关于\n下拉刷新所有皮肤内部都默认引入了IScroll5 **但是进行了一些轻微改动(主要是增加了功能，用来方便下拉刷新的实现，并不影响原本使用)**\n因此如果项目中其它地方有用到IScroll5，无需在引入，直接通过`IScroll`即可使用\n\n后续会定期更新皮肤\n\n### 更多说明\n\n* [examples目录结构说明](https://github.com/dailc/pulltorefresh-h5-iscroll/tree/master/examples/html)\n* [源码使用说明](https://github.com/dailc/pulltorefresh-h5-iscroll/tree/master/src/)\n\n#### 相关博文\n\n* [H5下拉刷新,多种皮肤，便于拓展！](http://www.jianshu.com/p/ef3183adb896)\n\n## 更新日志\n\n* 20170410\n\t* 版本`1.0.0`\n\t* 增加cmd引入支持\n\t* 修复IScroll内部`maxScrollY`引起的冲突\n* 20170518\n\t* 修复关闭上拉加载后，重复下拉刷新报错的bug\n* 20170526\n\t* 版本`2.0.0`\n\t* 从源码层面重新修改命名空间\n\t* 后续命名层面不会再有大的改动\n* 20170601\n\t* 内部源码优化\n\t* 不影响以前的使用\n* 20170608\n\t* 修改项目名称，同步修改示例资源路径\n* 20170609\n    * 源码目录结构微调，不影响使用\n* 20170612\n    * showcase将`targetPullToRefresh`简化为`skin`\n* 20170615\n    * 版本`3.0.0`\n    * API设计简化\n    * 去除不推荐使用的mui皮肤\n    * IScroll打包到内部\n* 20170621\n    * 更新`native`皮肤引入时的bug-由于重复打包core，导致命名冲突\n* 20170626\n    * 下拉刷新内部优化，调用方式默认变为`new`的使用方式\n* 20170711\n    * 下拉刷新`bizlogic`的重构，优化代码\n* 20170814\n    * 新增`type5`皮肤，仿照微信小程序的下拉效果\n* 20170830\n    * 这个库已经不再维护，全力维护更好的下拉刷新[minirefresh](https://github.com/minirefresh/minirefresh)\n\n## License (MIT)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdailc%2Fpulltorefresh-h5-iscroll","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdailc%2Fpulltorefresh-h5-iscroll","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdailc%2Fpulltorefresh-h5-iscroll/lists"}