iScroll 5始终将this.y设置为0

时间:2015-08-03 15:32:09

标签: backbone.js iscroll

看起来iscroll已正确启动。我附加一个回调到scrollEnd事件,我在每次垂直滚动尝试中得到的是

this.x: 0
this.y: 0
thisdirectionX: 0
thisdirectionY: 0

出于测试目的,我设置this.scroller.scrollTo(0,300);以查看脚本是否正常工作。一旦我尝试进一步滚动,滚动器就会恢复到初始位置,并且效果很好。

我使用browserify在backbone.js应用程序中加载模块。

var Iscroll = require('iscroll'); 

//for testing purposes to ensure that the scroller is loaded when the DOM is ready I do the following:

        setTimeout(function(){
            this.scroller = new Iscroll('#scroller', {
                scrollX: false,
                scrollY: true,
                click:true, // open click event
                scrollbars: false,
                useTransform: true,
                useTransition: true,
                probeType:3,
                mouseWheel:true,
                bindToWrapper: true
            });

            this.scroller.scrollTo(0,300);

            this.scroller.on('scrollEnd', function () {
                console.log('x: ' + this.x);
                console.log('y: ' + this.y);
                console.log('d.x: ' + this.directionX);
                console.log('d.y: ' + this.directionY);
                console.log('scroll end');
            });
            document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
        }, 3000);

尝试滚动后,我总是触发'touchstart'事件,当配置文件iscroll脚本时,this.xthis.y始终为0。

HTML很复杂,但我也没有测试过,我甚至禁用了css文件,但没有用。

<div id="scroller">
<ul class="c-list" style="transition-timing-function: cubic-bezier(0.1, 0.57, 0.1, 1); transition-duration: 0ms; transform: translate(0px, 0px) translateZ(0px);">
<li>...</li>
<li>...</li>
<li>...</li>
...
</ul>
</div>

有没有人有想法?

1 个答案:

答案 0 :(得分:0)

在我的情况下,通过将position: absoluteheight: 100%添加到包装器元素来解决问题