-1

当我尝试在我的 android 手机中向下滑动时，我的 iscroll 对象不会向下滑动到底部，但与底部有一段距离。像这样的 HTML 模板：

 /*The HTML template code like this:*/
 <div class="content">
    <div class="scroller">
       <div class="div1">
       </div>
    </div>
 </div>

 /*The javascript code like this:*/
 $.get(url, function(html){
                _this.$('.div1').html(html);
                _this.$('.div1').css('display','inline-block');
                var width=_this.$('.div1').width()||'400px';
                var height=_this.$('.div1').height()||'900px';
                //height+=210;
                if(width<=400)width=400;
                _this.$('.div1').css('width',width);
                _this.$('.div1').css('height',height);
                _this.$('.scroller').css('width',width);
                _this.$('.scroller').css('height',height);
                if(html.indexOf('errorpage')<=0)
                    _this.$('.div1').addClass('padding-all-4px');
                setTimeout(function () {
                    _this.scroll = new iScroll(_this.$('.content')[0],{
                        hScroll: true,
                        vScroll: true,
                        lockDirection: false,
                        zoom: true,
                        zoomMin: 0.5,
                        zoomMax: 4,
                        doubleTapZoom: 2
                    });
                }, 0);
            });
4

1 回答 1

2

有两种使用 iScroll 的方法。您可以使用 iScroll 的 jScroll 包装器，也可以使用纯 iScroll。为了让 iScroll 正常工作到您要附加 iScroll 的容器，它应该满足一些条件

  1. 容器应该有相对位置或绝对位置
  2. 容器应该有高度（如果你想要 vScroll）和宽度（如果你想要 hScroll）
  3. 容器溢出应该被隐藏（这由插件本身处理）
  4. 您不需要为子容器设置任何高度。子容器高度应取决于其内容

尝试这样的事情。

HTML 模板代码如下：

<div class="content">
    <div id="scroller_content">
       <div class="dynamic-content">
         <!-- you contents should be here -->
       </div>
    </div>
 </div>

像这样的javascript代码：

var scrollContent = new iScroll('scroller_content', {
    /* other options goes here */
  }
});

如果您将内容动态加载到子容器，那么您可以在加载内容后简单地刷新 iScroll 对象

scrollContent.refresh();

如果您想在 iScroll 中使用 iScroll，请尝试这样的操作。

会说你启用了两个 iScroll。并且child_container元素在您的parent_container内。然后，

var parentScroller, childScroller, childScrollerTimeout;

parentScroller = new iScroll('parent_container',{
  /* other options goes here */
});

childScroller = new iScroll('child_container',{
  /* other options goes here */
  onBeforeScrollStart : function(e){
    clearTimeout(childScrollerTimeout);
    parentScroller.disable();
  },
  onScrollEnd:function(){
    childScrollerTimeout = setTimeout(function(){
     parentScroller.enable()},500);
    /* it is required to use timeout. If not second time onBeforeScroll will not work as expected */
  }
});

如果您有任何不明白的地方，请告诉我。我将进一步演示。如果我在这里犯了任何错误，请向我道歉。希望这至少会有所帮助.. :)

于 2013-03-04T10:12:01.073 回答