iscroll
Improved scrollable element for desktop and touch device.
The goal of this library is high performance and easy to use, while keep the code simplicity.
Tested on Android > 2.2, IOS > 6 , IE > 8 and other modern browsers.
click here to see what device/os_version should be supported.
This library need Object.defineProperty
and CustomEvent
to work properly, if not exsit, the element hack (scrollTop and scroll event) would not available
Installation
$ npm install iscroll-component
You may need webpack to build this lib
Example
First element child is used as wrapper element
var Iscroll = ;var el = document;var scroll = el;el;
API
-
start
event is fired with y (translated) on scroll start. -
release
event is fired with y (translated) on touchend. -
scroll
event is fired with y (Just as scrollTop on the element) on scroll. -
scrollend
event is fired with Object containingtop
andbottom
indicate whether the element has scrolled to top or bottom.
iscroll(el, [opts])
Init iscroll with el and optional opts, set opts.handlebar
to true if you want handlebar.
-
opts.handlebar
set to false if you need disable handlebar -
opts.max
set maxium translateY default 80 -
opts.barClass
className for handlebar element, use this to replace default handlebar className which isiscroll-handlebar
.refresh()
Recalculate element height, call this after element height changed. Called automatically on scroll start, orientation change and window resize.
.scrollTo(y, [duration])
Set translateY to y
with optional duration(ms), called when you set el.scrollTop
.
.unbind()
Unbind all event listeners.
Test
npm install gulp http://localhost:8080/example/index.html
License
MIT