html中让页面点击向左滑动,HTML5页面点击和左右滑动页面滚动详解

String path = request.getContextPath();

String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";

%>

HTML5测试

$(function() {

var startX, startY, endX, endY;

var showADID = 1;

document.getElementById("divADBox").addEventListener("touchstart", touchStart, false);

document.getElementById("divADBox").addEventListener("touchmove", touchMove, false);

document.getElementById("divADBox").addEventListener("touchend", touchEnd, false);

function touchStart(event) {

var touch = event.touches[0];

startY = touch.pageY;

startX = touch.pageX;

}

function touchMove(event) {

var touch = event.touches[0];

endX = touch.pageX;

}

function touchEnd(event) {

$("#img0" + showADID).hide();

showADID++;

if (showADID > 4) {

showADID = 1;

}

$("#img0" + showADID).show();

$("#spText").html("X轴移动大小:" + (startX - endX));

}

})

t1.png

t2.png

t3.png

t4.png