官網：http://iscrolljs.com/
IScroll最簡單的DOM結構:
<div id="wrapper"> <ul> <li>...</li> <li>...</li> ... </ul> </div>
初始化iscroll
var myScroll = new IScroll('#wrapper',options);
初始化設置
初始化設置使用實例：
var myScroll = new IScroll('#wrapper', {
mouseWheel: true,
scrollbars: true
});
設置列表：
所屬
屬性名
說明
默認值
核心庫
croe
options.useTransform
是否使用CSS3的Transform屬性
true
options.useTransition
是否使用CSS3的Transition屬性，否則使用requestAnimationFram代替
true
options.HWCompositing
是否啟用硬件加速
true
options.bounce
是否啟用彈力動畫效果，關掉可以加速
true
基礎特性
Basic features
options.click
是否啟用click事件。建議關閉此選項並啟用自定義的tap事件（options.tap）
false
options.disableMouse
是否關閉鼠標事件探測。如知道運行在哪個平台，可以開啟它來加速。
false
options.disablePointer
是否關閉指針事件探測。如知道運行在哪個平台，可以開啟它來加速。
false
options.disableTouch
是否關閉觸摸事件探測。如知道運行在哪個平台，可以開啟它來加速。
false
options.eventPassthrough
使用IScroll的橫軸滾動時，如想使用系統立軸滾動並在橫軸上生效，請開啟。
event passthrough demo
false
options.freeScroll
主要在上下左右滾動都生效時使用，可以向任意方向滾動。
2D scroll demo
false
options.keyBindings
綁定按鍵事件。
Key bindings
false
options.invertWheelDirection
反向鼠標滾輪。
false
options.momentum
是否開啟動量動畫，關閉可以提升效率。
true
options.mouseWheel
是否監聽鼠標滾輪事件。
false
options.preventDefault
是否屏蔽默認事件。
true
options.scrollbars
是否顯示默認滾動條
false
options.scrollX
options.scrollY
可以設置是否顯示橫向或縱向滾動條
scrollX false
scrollY true
options.tap
是否啟用自定義的tap事件
可以自定義tap事件名
false
滾動條
Scrollbars
options.scrollbars
是否顯示默認滾動條
false
options.fadeScrollbars
是否漸隱滾動條，關掉可以加速
true
options.interactiveScrollbars
用戶是否可以拖動滾動條
false
options.resizeScrollbars
是否固定滾動條大小，建議自定義滾動條時可開啟。
false
options.shrinkScrollbars
滾動超出滾動邊界時，是否收縮滾動條。
‘clip'：裁剪超出的滾動條
‘scale':按比例的收縮滾動條（占用CPU資源）
false:不收縮，
false
options.indicators
指示IScroll該如何滾動，Scrollbars的底層實現方式。
options.indicators.el
制定滾動條的容器。容器中的第一個元素即為指示器。
例如：
indicators: {
el: document.getElementById('indicator')
}
indicators: {
el: '#indicator'
}
options.indicators.ignoreBoundaries
是否忽略容器邊界。設為true 可以設置滾動速度
parallax demo
false
options.indicators.listenX
options.indicators.listenY
指示器監聽那個方向的滾動，可以設置為一個方向或2個方向
true
options.indicators.speedRatioX
options.indicators.speedRatioY
指示器相對主滾動條的速度
0
options.indicators.fade
options.indicators.interactive
options.indicators.resize
options.indicators.shrink
如scrollbars的設置
minimap demo
options.probeType
需要使用iscroll-probe.js才能生效
probeType：1 滾動不繁忙的時候觸發
probeType：2 滾動時每隔一定時間觸發
probeType：3 每滾動一像素觸發一次
分割頁面snap
options.snap
自動分割容器，用於制作走馬燈效果等。
Options.snap:true//根據容器尺寸自動分割
Options.snap:el//根據元素分割
false
縮放
zoom
options.zoom
是否打開縮放
最好使用iscroll-zoom.js
如放大模糊，可將源容器定義為2倍大小，然後scale(0.5)
zoom demo
false
options.zoomMax
最大縮放等級
4
options.zoomMin
最小縮放等級
1
options.startZoom
初始縮放等級
1
options.wheelAction
滾輪動作
設為'zoom'，可以用滾輪縮放
undefined
更多設置
options.bindToWrapper
光標、觸摸超出容器時，是否停止滾動
false
options.bounceEasing
彈力動畫效果
預置效果：'quadratic', 'circular', 'back', 'bounce', 'elastic'（最後兩個不能通過css3表現）
還可以自定義效果
bounceEasing: {
style: 'cubic-bezier(0,0,1,1)',//css3時
fn: function (k) { return k; }//不使用css3，使用requestAnimationFrame時
}
'circular'
options.bounceTime
彈力動畫持續的毫秒數
600
options.deceleration
滾動動量減速
越大越快，建議不大於0.01
0.0006
options.mouseWheelSpeed
鼠標滾輪速度
options.preventDefaultException
列出哪些元素不屏蔽默認事件；
{tagName: /^(INPUT|TEXTAREA|BUTTON|SELECT)$/ }
options.resizePolling
重新調整窗口大小時，重新計算IScroll的時間間隔
60
鍵位綁定
options.keyBindings
監聽按鍵事件控制IScroll
例如：
keyBindings: {
pageUp: 33,
pageDown: 34,
end: 35,
home: 36,
left: 37,
up: 38,
right: 39,
down: 40
}
IScroll5的API：
所屬
方法名
說明
滾動
scrollTo(x, y, time, easing)
滾動到：x，y，事件，easing方式
x:int
y:int
time:int
Easing: quadratic | circular | back | bounce | elastic
見IScroll.utils.ease 對象
例：
myScroll.scrollTo(0, -100, 1000, IScroll.utils.ease.elastic);
scrollBy(x, y, time, easing)
滾動到相對於當前位置的某處
其余同上
scrollToElement(el, time, offsetX, offsetY, easing)
滾動到某個元素。el為必須的參數
offsetX/offsetY：相對於el元素的位移。設為true即為屏幕中心
scroll to element
分割頁面snap
goToPage(x, y, time, easing)
根據options.snap分割頁面，跳轉到橫向、縱向某頁。XY可以同時生效。
結合options.snap使用
next()
prev()
上一頁，下一頁
結合options.snap使用
縮放
zoom(scale, x, y, time)
縮放容器
Scale:縮放因子
刷新
refresh()
刷新IScroll
銷毀
destroy()
銷毀IScroll，節省資源
IScroll的事件：
beforeScrollStart
用戶點擊屏幕，但是還未初始化滾動前
scrollCancel
初始化滾動後又取消
scrollStart
開始滾動
scroll
滾動中
scrollEnd
滾動結束
flick
輕擊屏幕左、右
zoomStart
開始縮放
zoomEnd
縮放結束
事件使用實例：
myScroll = new IScroll('#wrapper');
myScroll.on('scrollEnd', doSomething);
IScroll的屬性：
myScroll.x/y
當前位置
myScroll.directionX/Y
上一次的滾動方向(-1 下/右, 0 保持原狀, 1 上/左)
myScroll.currentPage
當前Snap信息
myScroll.maxScrollXmyScroll.maxScrollY
當滾動到底部時的 myScroll.x/y