由Hammer.js阻止的垂直滚动

问题描述 投票:0回答:2

我正在尝试用英特尔XDK(版本2727)创建一个应用程序,现在我的问题是,当我有一个超过屏幕大小的列表时,我无法滚动垂直。我将问题追溯到Hammer.js。这个插件似乎用于侧边栏。所以我试图评论出来的消息,瞧,这是有效的。但我需要侧边栏,因此需要Hammer.js。经过研究后发现,其他人都有同样的问题,最常见的解决方案似乎是overflow-y: scroll;我也试过但没有运气。那么,如何在不进入Hammer.js的源数据的情况下解决这个问题,但是例如在CSS工作表上做一个例外?

html css phonegap-build intel-xdk hammer.js
2个回答
2
投票

好的,我找到了(部分)解决方案。在swipe-hammer.js“.upage”连接到各个方向的锤子。改为DIRECTIONS_HORIZONTAL,现在解决了这个问题。主要问题是因为Hammer连接整个页面而不仅仅是侧边栏。不知道这是否是正确的方法。

无论如何,非常感谢@Thomas给我提示。


0
投票

我们需要禁用hammerjs的pinch,rotate和pan事件,或者需要使用hammerjs处理垂直滚动。 hammejs将touch-action: none; css添加到你应用hammerjs事件的元素中。

要在Angular中禁用这些事件,您可以使用以下配置:

    export class MyHammerConfig extends HammerGestureConfig {
        overrides = <any>{
            // override hammerjs default configuration
            'swipe': { direction: Hammer.DIRECTION_HORIZONTAL },
            'pinch': { enable: false },
            'rotate': { enable: false },
            'pan': { enable: false }
        };
    }
© www.soinside.com 2019 - 2024. All rights reserved.