在App開發中，div區域滾動的需求是普遍存在的，但系統默認實現又有如下問題： Android平臺4.0以下不支持div滾動 Android平臺4.0以上支持div滾動，但不顯示滾動條 彈出層的div滾動在iOS平臺存在事件透傳的問題 因此，mui額外提供了區域滾動組件，使用時需要遵循如下DOM結構 ~~~ <div class="mui-scroll-wrapper"> <div class="mui-scroll"> <!--這里放置真實顯示的DOM內容--> </div> </div> ~~~ 區域滾動組件默認為absolute定位，全屏顯示；在實際使用過程中，需要手動設置滾動區域的位置（top和height） 若使用區域滾動組件，需手動初始化scroll控件 ***常用配置項:** ~~~ scroll.options options = { scrollY: true, //是否豎向滾動 scrollX: false, //是否橫向滾動 startX: 0, //初始化時滾動至x startY: 0, //初始化時滾動至y indicators: true, //是否顯示滾動條 deceleration:0.0006 //阻尼系數,系數越小滑動越靈敏 bounce: true, //是否啟用回彈 } ~~~ **示例：初始化scroll控件：** ~~~ mui('.mui-scroll-wrapper').scroll({ deceleration: 0.0005 //flick 減速系數，系數越大，滾動速度越慢，滾動距離越小，默認值0.0006 }); ~~~ mui中iOS平臺的下拉刷新（Android平臺的下拉刷新使用的是雙webview+原生滾動方案）、popover、可拖動式選項卡均使用了scroll組件。 為方便大家使用，mui還額外為scroll插件封裝了部分方法。 **滾動到特定位置** ~~~ scrollTo( xpos , ypos [, duration] ) xpos Type: Integer 要在窗口文檔顯示區左上角顯示的文檔的 x 坐標 ypos Type: Integer 要在窗口文檔顯示區左上角顯示的文檔的 y 坐標 duration Type: Integer 滾動時間周期，單位是毫秒 ~~~ 示例：快速回滾到該區域頂部，代碼如下： ~~~ mui('.mui-scroll-wrapper').scroll().scrollTo(0,0,100);//100毫秒滾動到頂 ~~~ **滾動到底部位置** 滾動到頂部的代碼比較容易實現,坐標值設為0、0即可；但滾動到底部，需要計算該區域的實際高度，因此mui封裝了scrollToBottom方法。 ~~~ scrollToBottom(duration) duration Type: Integer 滾動時間周期，單位是毫秒 ~~~ **橫向滾動** 橫向滾動只需在scroll組件基礎上添加mui-slider-indicatorcode mui-segmented-control mui-segmented-control-inverted這三個class即可.(給子元素添加mui-control-item可加大文字間距增強體驗 如:) ~~~ <div class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted"> <div class="mui-scroll"> <a class="mui-control-item mui-active"> 推薦 </a> <a class="mui-control-item"> 熱點 </a> <a class="mui-control-item"> 北京 </a> <a class="mui-control-item"> 社會 </a> <a class="mui-control-item"> 娛樂 </a> <a class="mui-control-item"> 科技 </a> </div> </div> ~~~