Awesome
Pull-to-refresh
A pull to refresh component for developers who loves elegence solution.
Now works with webpack and browserify, it's supposed to works with iscroll-component
To make them works reansonable, they are decoupled in 1.0.0
Features
- Call refresh as you need.
- Simplified code and API.
- Works with promise
Installation
Prefer to install with npm:
$ npm install pull-to-refresh
Install with component(1):
$ component install chemzqm/pull-to-refresh
Example
.scrollable {
position: fixed;
top: 50px;
left: 0px;
right: 0px;
bottom: 0px;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
<div id="demo" class="scrollable">
<div>
<ul>
<li></li>
</ul>
</div>
</div>
Notice the scrollable must have a single child for iscroll-component to work
var el = document.getElementById('demo')
var Ptr = require('pull-to-refresh')
var is = Iscroll(el, { handlebar: true })
var ptr = new Ptr(el, function() {
return ajax_and_prepend_dom( ) // refresh your data, should return promise
})
})
You can think iscroll just add nagetive scrollTop value to the scrollable.
API
Ptr(el, [option], callback)
el
the scrollable elementcallback
is called when loading start, the first argument which is a callback function should be called after the dom prepend to the list.option.timeout
for the request timeout in millisecond.option.template
contains a custom template(string or element) for the inserted elementoption.timeout
millisecond of request timeout, default10000
.refresh()
Perform refresh (with animation scroll to top at first).
.unbind()
Unbind all event listeners
License
The MIT License (MIT)