防止僅水平滾動移動應用程序

我正在開發一個Web應用程序。左側是使用Sidr插件的側邊欄（jQuery Plugin: Sidr）。測試網站在我的developing server上。我的問題是，如果我從左到右滑動顯示側邊欄。這是非常好的。但是，如果我想通過滑動來關閉側邊欄從右到左，我必須防止滾動通過添加此下面的代碼：防止僅水平滾動移動應用程序

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

我這樣做，但現在：我在頁面頂部導航（菜單）不能正常工作。直到最後我都無法滾動。

所以我的問題是：我該如何改變這一點。如果我要關閉左邊的邊欄，它應該只能防止垂直滾動。

這裏是我完整的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()}) 
});

來源

2013-05-12 Jan Andrè Schlösser

Make page not scrollable

像這樣的事情？

我認爲使用$（document）會更好！

參考：Prevent horizontal scroll on 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 
});

來源

2013-05-12 18:25:54

第一個鏈接實際上是正確的方法。但是這也妨礙了水平滾動。通過這種方式，我無法滾動導航（黑色頂部工具欄中的菜單鏈接）。 – 2013-05-12 18:43:35

也許這樣？未經測試。 var lastY; （文檔）$ .bind（ 'touchmove'，函數（E）{ VAR currentY = e.touches [0] .clientY; 如果（currentY === lastY）{//水平移動回報; } lastY = currentY; }）; – 2013-05-12 19:00:33

也許你不明白我的問題。我將更好地描述它： – 2013-05-12 19:09:30

我試圖整合錫德與錘JS，但有衝突，所以我擺脫錘和使用下面的代碼，它使用TouchWipe JS與錫德JS組合。

<!-- Swipe to open or close mobile menu --> 

<script> 

     jQuery(window).touchwipe({ 
     wipeLeft: function() { 
      // Close 
      jQuery.sidr('close', 'sidr-main'); 
     }, 
     wipeRight: function() { 
      // Open 
      jQuery.sidr('open', 'sidr-main'); 
     }, 
     preventDefaultEvents: false 
     }); 

</script>

我猜你遇到的問題，從右到左滑動應該是固定的。

來源

2015-04-17 19:08:46

防止僅水平滾動移動應用程序

回答

相關問題