防止在iOS和Android中拖动页面滚动 [英] Prevent page scroll on drag in IOS and Android

问题描述

我正在开发一个html5的画布游戏，但我不知道如何处理触摸事件。当用户触摸屏幕并拖动时，浏览器将滚动页面。我想防止它，并得到触摸开始，并触摸结束位置。是否有可能？

I'm working on a html5 canvas game, but I don't know how to handle touch events. When a user touch the screen, and drag, then the browser will scroll the page. I would like to prevent it, and get the touch start, and touch end position. Is it possible?

提前感谢

推荐答案

覆盖默认触摸行为以停止touchevents拖动页面。显然，如果你的页面大于可用区域，你就需要再处理它们，但是当你在做一个游戏，假设你做100％/ 100％的布局。

You need to override the default touch behaviour to stop touchevents dragging the page. Clearly, you'll need to handle them again if your page becomes larger than the available area, but as you're making a game, going to assume you're doing 100%/100% layout.

这段代码来自phonegap默认的index.html，但我会确定。

This code is from the phonegap default index.html but will help you out, I'm sure.

function preventBehavior(e) {
    e.preventDefault(); 
};

document.addEventListener("touchmove", preventBehavior, false);

我想添加一个东西，这是你完全在正确的轨道，避免框架。他们是伟大的一些事情，但你会得到一个更好的结果从地上。

I want to add one more thing which is you're totally on the right track avoiding the frameworks. They're great for some things, but you'll get a lot better result devving from the ground up.

编辑：这里是 W3C工作草稿谈论触摸事件，这可能是对你方便。

here's the W3C working draft talking about touch events, which might be handy for you.

这篇关于防止在iOS和Android中拖动页面滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！