离子范围输入防止滚动

Question

我有一堆滑块垂直堆放在我的应用程序中。当我点击滑动条，意图向下或向上滚动时，它会更改滑块值而不是滚动。

See a demo of the issue。

下面是社区成员之间的讨论，但我没有发现任何有用的有：

1. This reported issue这是与此相同的问题，但不知何故笔者在使用angular-js-slider库坚信，看起来像它的作品的作者。我试过这个库，问题仍然是一样的。

2. Reported issue与所有输入元素，而不仅仅是范围输入。可能是这样解决了其他输入类型如"text"的问题，但不适用于范围输入。

任何人都可以帮忙吗？

Answer 1

在网络上，滚动绝对不是问题，但在移动设备上，滑块的整个水平跨度充当了滚动的障碍。

由于我在移动环境中寻找解决方案，禁用任何鼠标事件的轨迹看起来足够我可以通过pointer-events，至少在铬上。

input[type=range] { 
    pointer-events: none; 
} 

input[type=range]::-webkit-slider-thumb { 
    pointer-events:auto; 
} 

这里发布的答案一直是contributed earlier here。