html5手势滑动效果,HTML5教程 滑动手势详解

本篇教程探讨了HTML5教程 滑动手势详解，希望阅读本篇文章以后大家有所收获，帮助大家HTML5+CSS3从入门到精通 。

<

左滑

删除

var touchGlobal;

document.getElementById("slideDiv").addEventListener("touchstart",function(e){

touchGlobal=e.touches[0];

},false);

document.getElementById("slideDiv").addEventListener("touchmove",function(e){

var touch=e.touches[0];

var x=Number(touch.pageX);

document.getElementById("divMove").innerHTML=x;

if(touchGlobal.pageX-x>0){

document.getElementById("btnDelete").setAttribute("style","display: inline");

}

else{

document.getElementById("btnDelete").setAttribute("style","display: none");

}

},false);

document.getElementById("slideDiv").addEventListener("touchend",function(e){

},false);

本文由职坐标整理并发布，希望对同学们有所帮助。了解更多详情请关注职坐标WEB前端HTML5/CSS3频道！