title: How to enable scroll bar when use "ontouchstart/ontouchmove/ontouchend" on android?
body: <p>I want to make a web page on mobile devices (both Android and iOS) with fingers swipe effect, but when I add <code>event.preventDefault()</code> into <code>ontouchstart</code> / <code>ontouchmove</code> / <code>ontouchend</code> callback functions the scroll bar of the web page is being disabled, it is a disaster :(</p>
  
  <p>I made an ugly hack for this with <code>scrollTop</code> so that the page can be scrolled:</p>
  
  <pre><code>element.ontouchmove = function(event) {
      event.preventDefault();
      var oldScrollTop = document.body.scrollTop;
      var dist = final_y - start_y // here start_y is pageY from touchstart and final_y is current pageY
      document.body.scrollTop = oldScrollTop - dist &gt; 0 ? oldScrollTop - dist : 0;
      //...
  }
  </code></pre>
  
  <p>It works now but I still want to know:</p>
  
  <ol>
  <li>It is there any other better solutions about this?</li>
  <li>Why we must use "preventDefault()" in the callback functions? what we have prevented by this?</li>
  </ol>
  
  <p>Thanks.</p>