手机HTML之touch小记

最近在考虑一个手机站开发，设计师总能有些奇思妙想，但手机HTML上的展示效果肯定比不上APP和桌面浏览器，最后只确定了一个滑动切换图片的功能。

手机浏览器的touch事件：touchstart，touchmove，touchend，touchcancel。

试了一下android和IOS上的浏览器支持以上方法，WP8不支持。

这些事件需要绑定

document.addEventListener('touchstart',function(e){
    startX = e.touches[0].pageX;
},false);

android测试发现，点击屏幕触发touchstart和touchend事件；滑动触发touchstart和一次touchmove事件，未触发touchend。

加上event.preventDefault()取消浏览器默认事件以后正常；

document.addEventListener('touchstart',function(ev){
    event.preventDefault();
    startX = ev.touches[0].pageX;
},false);

点击触发touchstart，移动中多次触发touchmove，结束触发touchend。