简易实现上拉刷新UpRefresh

缘起:最近研究上拉刷新,记录下自己实现的一个超简易版,大概记录下原理;

github: https://github.com/dclnet/UpRefresh   代码和demo都在这,有需要的可以看看。

原理: 这个实现比较简单,就是父div块固定高度,子div块不定高度,父块绑定onscroll事件处理,event里面scrollTop获取当前滚动到的距离加父块高度看是不是等于子块高度,等于则标明已经滚动到底了,然后触发上拉刷新,就这么简单。

使用是直接引入UpRefresh.js文件就好,其他样式可以参考着demo写,初始化代码:

new UpRefresh({
    wrapId: '#wrap',   // 定高父块
    childId: '#list',  // 变高子块
    init: function(){ // 执行些初始化工作 },
    up: function() { // 上拉执行call }
});

 

因为是超简易版实现,所以也没在太多平台测试,有疑问和bug的可以留言哈~

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值