javascript 如何使用 Hammer.js 在 iOS 中禁用垂直滚动?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15541152/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I disable vertical scrolling in iOS using Hammer.js?
提问by OMA
I'm trying to disable vertical scrolling in iOS with Hammer.js (jQuery version) in a horizontally scrolling list. I've tried this:
我试图在水平滚动列表中使用 Hammer.js(jQuery 版本)禁用 iOS 中的垂直滚动。我试过这个:
$(document).hammer().on('swipe,drag', 'body',
function(event)
{
if (event.direction == Hammer.DIRECTION_UP || event.direction == Hammer.DIRECTION_DOWN)
{
event.preventDefault();
}
}
);
But it doesn't work. So, how do I disable the scroll vertically while still being able to scroll horizontally?
但它不起作用。那么,如何在仍然能够水平滚动的同时禁用垂直滚动?
回答by Bart Burg
I did it using the event.gesture.preventDefault:
我使用 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);
}
});
Here is the given documentation
这是给定的文档
[EDIT]
[编辑]
My answer was only to let you know you were using the wrong event.preventDefault(). In fact you also used the wrong syntax to check the event direction. You should be able to manage it in this way, though I haven't tested it:
我的回答只是让您知道您使用了错误的 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();
}
});
2 things are changed: event.gesture.direction and event.gesture.preventDefault(); The event.direction was the way to do it on older versions of hammer js.
改变了 2 件事:event.gesture.direction 和 event.gesture.preventDefault();event.direction 是在旧版本的hammer js 上执行此操作的方法。
Note: if you want to do something with the swipe event, for instance: jump a bigger amount horizontally when swiping, you can combine my answers.
注意:如果你想对滑动事件做一些事情,例如:滑动时水平跳跃更大的量,你可以结合我的答案。
回答by Brian Sweat
Check out this page:
看看这个页面:
Try this assuming your $
is jQuery and you are using the jQuery version of hammer.js
假设你$
是 jQuery 并且你使用的是 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();
}
});
回答by Ryan DeBeasi
You can use the drag_block_vertical option to disable vertical scrolling:
您可以使用 drag_block_vertical 选项禁用垂直滚动:
$(document).hammer({drag_block_vertical: true}).on('swipe,drag', 'body', function(event){
// etc
});
Also, you're calling it on the body element, which should always exist. For that reason, you could probably simplify to:
此外,您在应该始终存在的 body 元素上调用它。因此,您可能可以简化为:
$('body').hammer({drag_block_vertical: true}).on('swipe,drag', function(event){
// etc
});
回答by Jorik
Hammer(document.body, { prevent_defaults: true });
锤子(document.body, { prevent_defaults: true });