我們知道，IScroll.js插件是相容所有行動裝置捲軸事件的插件，在某些安卓機中，我們沒辦法透過overflo:scroll操作捲軸；但IScroll.js確可以放在安全的容器元素中處理滾動，下面就跟大家詳細介紹一下IScroll.js。
注意
在使用IScroll.js必須要有3層元素嵌套，如：
<div class="food-left">
<ul class="food-nav">
<li></li>
<li></li>
<li></li>
<li></li>
</ul></div>最外層的food-left必須要有兩個css樣式：position:relative;和overflow:hidden。
初始化
IScroll.js給我們暴露了一個IScroll建構子;
如下，我們進行了初始化
<script type="text/javascript">
leftScroll = new IScroll(".food-left");</script>建構子中傳入的實參，與ES6新增的querySelector參數一致；其實querySelector就與我們的jQuery選擇器使用方式是一樣的；
注意：我們必須在DOM結構載入完畢後才能初始化，否則會無效。
設定
IScroll.js允許我們傳入第二個參數來配置滾動事件的屬性;
leftScroll = new IScroll(".food-left", {
scrollbars: true,
bounce: false,
mouseWheel:true,
click:true});滾動條
scrollbars: true
是否顯示滾動條。預設為false;
fadeScrollbars:true
滾動條淡入淡出效果,當然前提是你滾動條顯示了。預設為false;
interactiveScrollbars
是否拖曳滾動條。預設為false;
resizeScrollbars
滾動條的長度是按照比例設定的，如果想要固定尺寸，可以設定為flase;預設為true;
bounce: false
滾動到達容器邊界時是否執行反彈動畫。預設為true;
mouseWheel:true
是否顯示啟用滑鼠捲動;預設為false;
invertWheelDirection
啟動滑鼠捲動後是否啟用反向捲動;預設為false;
click:true
iScroll禁止預設滑鼠的點擊行為，如果要使用設定true;預設為false;
disableMouse、disablePointer、options.disableTouch
IScrol預設監聽所有的指標事件，如果確認專案定位的平台，可以將不使用的效果停用，減少資源佔用；預設為false;
startX、startY
設定滾動條初始偏移位置；預設為無;
方法
IScroll.js也提供我們一些方便的方法,當然都是實例物件下的；
rightScroll.scrollToElement(el, time, offsetX, offsetY, easing)
滾動到傳入元素的位置，必須是原生DOM物件；然後是滾動的時間；
scrollTo(x, y, time, easing)
可以滾動到任意的位置，預設位置是0，如果要移動需要設定負數；
相信看了這些案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！
相關閱讀：
以上是行動端插件IScroll.js應該如何使用的詳細內容。更多資訊請關注PHP中文網其他相關文章！
