| <!DOCTYPE html> |
| <html style="width: 100%; height: 100%"> |
| <head> |
| <script> |
| function touchHandler(e, type) { |
| var touchResult = document.getElementById("last-touch-event"); |
| touchResult.innerHTML = type; |
| } |
| |
| function getLastTouchEvent() { |
| var touchResult = document.getElementById("last-touch-event"); |
| return touchResult.innerHTML; |
| } |
| |
| window.addEventListener('load', function(){ // on page load |
| document.body.addEventListener('touchstart', |
| function(e){ |
| touchHandler(e, "touchstart"); |
| }, false); |
| |
| document.body.addEventListener('touchmove', |
| function(e){ |
| touchHandler(e, "touchmove"); |
| }, false); |
| |
| document.body.addEventListener('touchend', |
| function(e){ |
| touchHandler(e, "touchend"); |
| }, false); |
| }, false); |
| </script> |
| </head> |
| |
| <!-- Be sure to set 100% width/height so the test can determine an appropriate |
| screen region for targeting events. --> |
| <!-- Make the body touch-action: none to force sending the touch action back |
| to the browser during the test, so we can verify that functionality. --> |
| <body style="width: 100%; height: 100%; touch-action: none"> |
| Page with Touch Handler |
| <div id="last-touch-event">noevent</div> |
| </body> |
| </html> |