如何在iOS中使用Hammer.js禁用垂直滾動？

我想在水平滾動列表中使用Hammer.js（jQuery版本）在iOS中禁用垂直滾動。我試過這個：如何在iOS中使用Hammer.js禁用垂直滾動？

$(document).hammer().on('swipe,drag', 'body', 
    function(event) 
    { 
     if (event.direction == Hammer.DIRECTION_UP || event.direction == Hammer.DIRECTION_DOWN) 
     { 
      event.preventDefault(); 
     } 
    } 
);

但它不起作用。那麼，我應該如何垂直禁用滾動，同時仍然能夠水平滾動？

來源

2013-03-21 OMA

你有沒有試過更新的答案？ – 2014-05-02 11:11:49

我做到了使用event.gesture.preventDefault：

$('#horizontalCarousel').hammer({ drag_lock_to_axis: true }).on("swipe drag", function(event) { 
     event.gesture.preventDefault(); 
     if(event.type == "swipe"){ 
      swipeAction(event); 
     } else { 
      dragAction(event); 
     } 
});

這裏是給documentation

[編輯]

我的回答只是讓你知道你使用了錯誤的event.preventDefault（）。事實上，你也使用錯誤的語法來檢查事件的方向。你應該能夠管理它以這種方式，雖然我沒有測試它：

$(document).hammer({ drag_lock_to_axis: true }).on("swipe drag", function(event) { 
      if (event.gesture.direction == Hammer.DIRECTION_UP || event.gesture.direction == Hammer.DIRECTION_DOWN){ 
       event.gesture.preventDefault(); 
      } 
    });

兩件事情改變：event.gesture.direction和event.gesture.preventDefault（）; event.direction是在老版本的錘子js上使用它的方法。

注意：如果您想要使用滑動事件做些事情，例如：在滑動時水平跳過更大的數量，您可以合併我的答案。

來源

2013-10-17 09:56:11

你好巴特。感謝您的回答。我終於開始嘗試這樣做了，但這只是完全禁用了滾動，我已經設法做到了這一點（當屏幕外沒有任何項目時我需要這樣做）。我只需要垂直禁用滾動。 – OMA 2013-11-21 06:55:31

爲什麼你不確定div不能用css滾動？（overflow-y：hidden;）。您仍然可以通過使用event.gesture.deltaY知道手勢的移動來使div可滾動。 – 2014-02-01 10:04:05

@OMA我更新了答案，它現在應該可以工作。 – 2014-02-07 08:39:26

-2

Hammer（document.body，{prevent_defaults：true}）;

來源

2013-03-23 12:12:35 Jorik

這不就是禁用所有事件嗎？（甚至點擊事件）。另外，如何禁用垂直滾動？ – OMA 2013-03-25 23:03:46

看看這個頁面：

https://github.com/EightMedia/hammer.js/wiki/Event-delegation-and-how-to-stopPropagation---preventDefaults#evgesturestoppropagation

試試這個假設你$是jQuery和你正在使用hammer.js

$('body').hammer().on('touch', function(ev){ 
     var $t = $(ev.target); //let's you know the exact element you touched. 
     if(ev.gesture.direction === 'left' || ev.gesture.direction ==='right'){ 

     } else { 
      ev.gesture.preventDefault(); 
     } 
});

來源

2013-06-04 18:51:11

與此相關的問題是，垂直滾動有時會開始橫向...並且瀏覽器有時會在它認爲您正在滾動之後繼續執行操作。 – 2013-09-27 21:53:44

我不得不說，當你垂直啓動一個滾動方向時，滾動只會鎖定到垂直滾動。它在我看來影響了可用性。 – 2013-10-27 12:16:03

感謝您的回答。不幸的是，這不能在我的測試中禁用垂直滾動。 – OMA 2013-11-21 06:56:11

的jQuery的版本可以使用drag_block_vertical選項禁用垂直滾動：

$(document).hammer({drag_block_vertical: true}).on('swipe,drag', 'body', function(event){ 
    // etc 
});

另外，你在body元素上調用它，它總是存在的。出於這個原因，你也許可以簡化爲：

$('body').hammer({drag_block_vertical: true}).on('swipe,drag', function(event){ 
    // etc 
});

來源

2013-08-12 16:44:17

嗨，感謝您的回答，但這似乎並不能在我的測試中禁用垂直滾動。我試着在裏面添加event.preventDefault（），但仍然沒有幫助。 – OMA 2013-11-21 06:56:49

如何在iOS中使用Hammer.js禁用垂直滾動？

回答

相關問題