jScrollPane 无法在 Windows 8 触摸屏笔记本电脑的浏览器上滚动内容答案

【问题标题】：jScrollPane Unable to scroll the content on Browsers in Windows 8 touch screen laptopjScrollPane 无法在 Windows 8 触摸屏笔记本电脑的浏览器上滚动内容
【发布时间】：2013-01-21 08:21:38
【问题描述】：

我在我的网站中使用 jQuery jScrollPane 插件，它在普通 PC 浏览器和 iPad、Android 平板电脑上运行良好..

但是当我在 Windows 8 触摸屏笔记本电脑上打开我的网站时，我无法像在 iPad 或 Android 平板电脑中那样使用触摸手势滚动页面。

我也试过这个演示网站(http://jscrollpane.kelvinluck.com/themes/lozenge/)，我无法用触摸手势滚动内容。

要滚动页面，我必须转到滚动条并将其向左/向右拖动。之前使用默认滚动条，我可以使用触摸手势滚动页面，现在我不能使用 jScrollPane。

我可以在 Chrome 中滚动内容（演示和我的网站，在 windows8 设备中），但不能在 IE 和 FireFox

中滚动

这是一个已知问题吗？我该如何解决这个问题？

jScrollPane 是否仅支持 webkit 浏览器的触摸手势？

如果是，我们怎样才能使它适用于所有浏览器，尤其是 Firefox 和 IE？

更新：

正如我在评论布鲁诺回答时提到的那样，我们已经尝试使用以下样式来划分该部门。但没有运气

.scroll-pane{
overflow-x:scroll; 
-ms-touch-action: pan-x;    
}

and 

.scroll-pane{
overflow-x: scroll;
-ms-scroll-snap-type: mandatory;
-ms-scroll-snap-points-x: snapInterval(0%, 100%);

}

【问题讨论】：

标签： javascript jquery windows-8 jscrollpane jquery-jscrollpane

【解决方案1】：

将此样式添加到 CSS 的 body 标记中。

overflow-x:scroll ; 
-ms-touch-action: pan-x;

它对我有用。希望这对您也有帮助。祝你好运。

【讨论】：

【解决方案2】：

是的，jScollPane 只关心 webkit 触摸事件（它们是唯一的 atm 事件），但现在 MS 引入了 Pointer events，虽然很容易检测到许多开发人员不这样做。想到的另一个例子是 FlexSlider 插件，它也用于仅检测 touchend、touchstart 等。

如果您想让 jScollPane 在 Win8 中工作，您可能需要修改源并对其进行调整以检测 MS 指针事件。

【讨论】：

除了修改 jScrollPane 源之外，您还可以捕获 Win8 指针事件并将它们委托给 jScrollPane（假设 jScrollPane 让您能够这样做）。
@JasonL。我们已经尝试通过 css 使用 -ms-touch-action: pan-x; -ms-scroll-snap-type: mandatory;-ms-scroll-snap-points-x: snapInterval(0%, 100%); 这些样式来滚动窗格 div，但没有运气。参考。链接：msdn.microsoft.com/en-us/library/ie/jj583807%28v=vs.85%29.aspx
即使这也有效，这只能解决 IE 上的问题，而不是 FireFox 上的问题

【解决方案3】：

我将 MsPointerEvents (http://goo.gl/MnEIh) 添加到 jquery.jscrollpane.js：

https://raw.github.com/karacas/jScrollPane/9fe8872f6e2438a87847e3d01b46648f06d15fc1/script/jquery.jscrollpane.js

希望它有效，抱歉，但我无法测试这个，因为我没有 w8。

【讨论】：