仅防止水平滚动移动应用

我正在开发一个网络应用程序。 左侧是使用Sidr-plugin（ jQuery插件：Sidr ）的侧边栏。 测试站点在我的开发服务器上 。 我的问题是，如果我从左向右滑动，则会显示侧边栏。 这是非常好的。 但是，如果我想通过从右向左滑动来关闭侧边栏，我必须通过添加以下代码来阻止滚动：

$('body').bind('touchmove', function(e){e.preventDefault()}) 

我这样做了，但现在：我在页面顶部（菜单）的导航function不正常。 我不能滚动直到最后。

所以我的问题是：我怎样才能改变这一点。 如果我要关闭左侧的边栏，它应该只能阻止垂直滚动。

这是我完整的JavaScript：

 $(function(){ $(document).foundation(); $('#sidebar-toggle').sidr(); var hammertime = Hammer(document.getElementById("wrapper")).on("swiperight", function(event) { $.sidr('open'); }); var hammertime = Hammer(document.getElementById("wrapper")).on("swipeleft", function(event) { $.sidr('close'); }); var hammertime = Hammer(document.getElementById("content")).on("tap", function(event) { $.sidr('close'); }); $('body').bind('touchmove', function(e){e.preventDefault()}) }); 

Answer 1

使页面不可滚动

像这样的东西？

我认为使用$（文档）会更好！

参考： 防止jQuery Mobile上的水平滚动

 var lastY; $(document).bind('touchmove', function (e){ var currentY = e.touches[0].clientY; if (currentY !== lastY){ // moved vertically return; } lastY = currentY; //insert code if you want to execute something when an horizontal touchmove is made }); 

Answer 2

我试图将Sidr与Hammer JS集成，但是存在冲突，所以我摆脱了Hammer并使用了下面的代码，它使用了TouchWipe JS和Sidr JS。

我想你应该修复你从右向左滑动所面临的问题。