Firefox操作系統應用程序 - HTML畫布 - 觸摸也移動頁面

我做了一個主屏幕looking like this模擬股票android的解鎖刷卡功能的Firefox OS應用程序。Firefox操作系統應用程序 - HTML畫布 - 觸摸也移動頁面

觸摸事件的作品，但問題是，在畫布上點擊按預期工作。但是，如果我嘗試模仿滑動手勢，整個網頁將移動而不是向畫布發送多個觸摸事件。

<div style="text-align:center; margin-top:3%;" > 
    <canvas id="paint" style="border:1px solid #000000; display: inline;"></canvas> 
</div> 

<div style="position: relative; margin-top:25px;"> 
    <p style="bottom: 0; width:100%; text-align: center; color:purple;"> 
     <a href="#/credits/"><strong>About</strong></a> 
    </p> 
</div> 

<script type="text/javascript"> 
    var canvas = document.getElementById("paint") 
    var ctx = canvas.getContext("2d"); 
    // ... init part of the code 

    function main_function(event){ 
     // calculate size and shadow of the 
     // circles according to the position of the touch 
     // and then redraw the canvas 
    } 

    canvas.addEventListener("mousemove", main_function); 
    canvas.addEventListener("touchmove", main_function); 
</script>

如何確保在製作滑動手勢時，所有信號都被畫布捕獲，並且不會導致頁面向上/向下移動？

來源

2015-05-08 darkryder