1. 程式人生 > >關於iscroll外掛的一些小用法

關於iscroll外掛的一些小用法

一、 在使用iscroll的時候的注意事項: 1 引入iscroll.js檔案 頁面中head標籤下引入 iscroll.js 2 引入初始化程式碼片段 編輯HTML結構 注意 iScroll作用於滾動區域的外層。只有容器元素的第一個子元素能進行滾動,其他子元素被忽略 初始化片段:

<script type="text/javascript">
var myScroll = new IScroll('#wrapper');
//wrapper:指的是容器的id。當然。類名也行
</script>

4 在容器新增overflow:hidden;

5 注意:當在動態生成的程式碼中使用,如有圖片生成的情況下,注意好圖片是否是已經生成 一下程式碼是獲取生成的圖片的長度,進而去判斷是否全部生成,然後再呼叫iscroll事件

 // 封裝右側圖片的滾動,配合iscroll
    function pyg_scroll() {
        var imgLength = $(".right_class img").length;
        $(".right_class img").on("load", function () {
            // 判斷,當圖片長度為0的時候,初始化滾動條。因為每次載入完成,圖片長度減減                          
            imgLength--;
            if (imgLength == 0) {
    //初始化的iscroll
rightScroll = new IScroll('.right_class'); } }) }

二、關於iscroll的點選回到頂部的程式碼片段 1 先生成一個iscroll物件,然後,呼叫自身的api

var myScroll = new IScroll('.left_list');//.left_list:指的是容器的類名,id也可以
myScroll.scrollToElement(this);//this:指的是當前點選的物件