0

我是一名新开发人员,正在尝试创建一个 jQTouch 应用程序来在多个页面中显示一些可滚动的内容。我决定使用 iscroll,它只在主页上运行良好。我读过我需要在每一页之后刷新iscroll,但我完全不知道如何做到这一点。这是我的脚本:

<script type="text/javascript">
    var myScroll, myScroll2;
    function loaded() {
        setTimeout(function () {
            myScroll = new iScroll('wrapper1');
        }, 100);
        setTimeout(function () {
            myScroll2 = new iScroll('wrapper2');
        }, 100);
    }

    document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
    document.addEventListener('DOMContentLoaded', loaded, false);
</script>

在我的 html 中,我有一个 divid="wrapper1"可以正常工作,直到我导航到该 divid="wrapper2"具有橡皮筋效果的第二页。

4

2 回答 2

1

如果您还没有弄清楚这一点(尽管我确定您有),您想要:

myScroll.refresh()

或者

myScroll2.refresh()
于 2011-12-12T16:09:23.997 回答
0

好的,终于让这个工作了。为了让 jQTOuch 和 iScroll 相互配合,每次 JQTouch 使页面上的滚动区域消失时,都需要重新设置它们。换句话说,一旦你隐藏了 div,iScroll 就不知道下次让它可见时要滚动什么。因此,您会得到臭名昭著的橡皮筋效应。要解决这个问题,只需添加一个事件侦听器,它会在调用 div 后立即重置滚动区域。确保给它 100 到 300 毫秒的延迟。下面的代码假设您的变量被调用myScroll

$(".about").tap(function(){
    setTimeout(function(){myScroll.refresh()},300);
});

附带说明一下,这里是如何使用 iScroll 建立多个滚动条:

var scroll1, scroll2;
function loaded() {
    scroll1 = new iScroll('wrapper1');
    scroll2 = new iScroll('wrapper2');
}
于 2012-09-12T01:14:05.243 回答