iscroll5的相对于版本4的变化，以及下拉刷新，上拉更多实例

　　（1）需要系统学习iscroll5的一些新特性，可以查看iscrollAPI:

　　中文手册：http://wiki.jikexueyuan.com/project/iscroll-5/ 或 http://www.mamicode.com/info-detail-331827.html

　　英文手册：http://cubiq.org/iscroll-5

　　（2）在使用iscroll5的时候，也遇到了一些问题

• 创建iscroll, myScroll = new IScroll('#wrapper', {...});　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　iscroll4在创建iscroll时是 iscroll=new iScroll('wrapper', {...});　，版本5与4在创建对象时变化了。　

• iscroll5增加了一些新属性，click: true                                                                                                                                                        

  options.click

  为了重写原生滚动条，iScroll禁止了一些默认的浏览器行为，比如鼠标的点击。如果你想你的应用程序响应click事件，那么该设置次属性为true。请注意，建议使用自定义的tap 事件来代替它（见下面）。
  默认属性：false

• probeType:3,//像素级的触发scroll事件                                                                                                                                                                                                       我没太看懂官网属性的解释，我测试了一下，probeType: 1时，无法实时响应我的myScroll.on("scroll",function(){...});probeType: 2或3时，myScroll.on("scroll",function(){...});事件都能及时响应。

  options.probeType

  这个属性是调节在scroll事件触发中探针的活跃度或者频率。有效值有：1, 2, 3。数值越高表示更活跃的探测。探针活跃度越高对CPU的影响就越大。

  • probeType: 1 对性能没有影响。scroll事件只有在滚动条不繁忙的时候触发。
  • probeType: 2 除了在势能和反弹范围内，将在scroll事件周期内一直执行。这类似于原生的onScroll事件。
  • probeType: 3 像素级的触发scroll事件。注意，此时滚动只关注requestAnimationFrame (即：useTransition:false).

• scrollbar滑动时显示，不滑动时影藏                                                                                                                                                                                                      scrollbars: true,                                                                                                                                                                                                                                      interactiveScrollbars: true,                                                                                                                                                                                                                shrinkScrollbars: 'scale',                                                                                                                                                                                                        fadeScrollbars: true

• 首先列表先要加载完后，才能创建初始化iscroll

• 首先给iscroll一个最小的初始高度，不然高度不填充完，无法下拉刷新　　　

//scroller的min高度
$("#msgList").css("min-height",weinHeight-headerHeight + "px");

• 在不需要使用iScoll的时候调用iScroll实例的公共方法destroy()可以释放一些内存。

　　　　　　　//iscroll存在时，销毁iscroll
            if(myScroll != undefined){
                myScroll.destroy();
                myScrollEventBindFlag = true;
            }

• preventDefault属性不要轻易使用

options.preventDefault

当事件触发时师傅执行preventDefault()。此属性应该设置为true，除非你真的知道你需要怎么做。
请参考下面的Advanced features中的preventDefaultException，可以获取更多控制preventDefault行为的信息。
默认值：true

<div id="wrapper">
        <div id="scroller" style="transition-timing-function: cubic-bezier(0.1, 0.57, 0.1, 1); transition-duration: 0ms; transform: translate(0px, 0px) translateZ(0px);">
            <!-- 下拉刷新 -->
            <div class="showbox" id="downLoading" style="display:block;">
                <div class="loadingWord">
                    <img src="../images/down-vector.png">
                    <span class="loading_text downRefreshLable">下拉刷新</span>
                </div>
            </div>
            <div id="scroller-content">
                <ul id="msgList" style="min-height: 529px;">
　　　　　　　　　　　　<li>1111111111111111111111111111111</li>
　　　　　　　　　　　　<li>2222222222222222222222222222222</li>
　　　　　　　　　　　　<li>3333333333333333333333333333333</li>
　　　　　　　　　　　　<li>4444444444444444444444444444444</li>
　　　　　　　　　　　　<li>5555555555555555555555555555555</li>
　　　　　　　　　　　　<li>6666666666666666666666666666666</li>
　　　　　　　　　　　　<li>7777777777777777777777777777777</li>

　　　　　　　　　　　　<div class="showbox" id="upLoading" style="display:block;">
　　　　　　　　　　　　　　<div class="loadingWord"><img src="../images/up-vector.png"><span class="loading_text downRefreshLable">上拉更多</span></div>
　　　　　　　　　　　　</div>
　　　　　　　　　　</ul>
            </div>
        </div>
    </div>

/**
         * 创建iscroll,初始化
         */
        initIScroll : function(){
            //iscroll存在时，销毁iscroll
            if(myScroll != undefined){
                myScroll.destroy();
                myScrollEventBindFlag = true;
            }
            //触发事件标志
            var refreshKey = false;//
            var loadMoreKey = false;//
            //重置查询开始条数
            //searchStartNum = 1;
            
            //创建iscroll,初始化
            myScroll = new IScroll('#wrapper', {
                probeType:3,//像素级的触发scroll事件
                click: true, 
                scrollbars: true,
                mouseWheel: true,
                interactiveScrollbars: true,
                shrinkScrollbars: 'scale',
                fadeScrollbars: true
            });
            
            if(myScrollEventBindFlag){
                //绑定后锁死 
                myScrollEventBindFlag = false;
                //滑动时触发
                myScroll.on("scroll", function(){
                    var y = this.y;
                    var maxY = this.maxScrollY - y;
                    //console.log("y===" + y + " maxY===" + maxY);
                    
                    if(y >= 40){
                         $('#downLoading').find('img').animate({
                                'transform':'rotate(180deg)',
                                '-ms-transform':'rotate(180deg)',
                                '-moz-transform':'rotate(180deg)', 
                                '-webkit-transform':'rotate(180deg)',
                                '-o-transform':'rotate(180deg)'},200);
                               $('#downLoading').find('.loading_text').html(eval("msgListLang." + common.sysLang +".pageMessage.relaseRefreshInfo"));//'释放更新'
                               refreshKey = true;//下拉超过40，释放后刷新数据
                               
                        return "";
                    }else if(y < 40 && y > 0){
                        $('#downLoading').find('img').animate({
                            'transform':'rotate(-0deg)',
                            '-ms-transform':'rotate(-0deg)',
                            '-moz-transform':'rotate(-0deg)', 
                            '-webkit-transform':'rotate(-0deg)',
                            '-o-transform':'rotate(-0deg)'},200);
                            $('#downLoading').find('.loading_text').html(eval("msgListLang." + common.sysLang +".pageMessage.downRefreshInfo"));//'下拉刷新'
                            refreshKey = false;//下拉小于40
                            
                        return "";
                    }
                });
                //下滑事件，松手后触发
                myScroll.on("slideDown",function(){
                    if(this.y > 40){
                        
                        //获取消息列表
                        searchStartNum = 1;
                        slipUpFalg = false;
                        //刷新数据
                        MsgList.getMessageListFunction();
                        //每次完成重置一下
                        searchStartNum = 1;
                        myScroll.refresh();                         
                    }
                });
                
                //上滑事件，松手后触发
                myScroll.on("slideUp",function(){
                    if(this.maxScrollY - this.y > 40){
                        //alert("当前滑动所在行")
                        //当前滑动所在行
                        //myScroll.scrollToElement($('#scroller .js_msgItem').eq(searchStartNum), null, null, true);
                        //自动计算下载所需要的条数
                        searchStartNum += searchEachAllCount;
                        slipUpFalg = true;
                        //添加数据
                        MsgList.getMessageListFunction();
                        myScroll.refresh(); 
                    }
                });
            }
            
        },