javascript - 移动端js问题，怎么不禁止Touch禁止文档被拖拽？

自己做了一个js的Touch小游戏。不过现在出现了一个非常烦人的问题。

如图红色框框所示，该怎么避免。
首先找到了一个在body中添加,onmousewheel=“return false”这个事件，不过经过测试，这个事件就对PC端有效果，
然后找到的是将小游戏的canvas position设置成 fixed。问题来了，由于fixed的设定导致了 canvas 的位置是相对于屏幕了，不跟随文档流，破坏了页面结构。
接着找到的解决方案是将Touch事件remove，很明显，一个基于Touch的小游戏，怎么可能remove掉Touch。

那么现在所要寻求的解决目的是：
既不能禁止Touch，又不能使用fixed，还要保证至少在小游戏的canvas界面上，手指任意滑动不会造成像图片中那要，出现红色框框的区域，说白了，就是让页面不动。
我的页面保证了如下几点：
游戏页面是在iPad上测试的，iPad上有足够大的空间容下游戏的canvas，所以不存在canvas溢出屏幕被迫造成屏幕滚动。
其次，即便是因为溢出滚动，我所希望的是往溢出的方向滚动，不应该出现上面压根没有内容的地方。

最后，我整个小游戏都没有使用jQuery，所以，也不想为了解决这一个小问题引用一个jQuery。如果就是迫不得已，还是希望大神们能够贴出用到jQuery中哪一小段代码（开发版的不是那个min）。

canvas的小游戏现在不计其数，我认为解决这个问题根本就不会很难。。。。

大神们 拜托了。。