H5上滑跳转页面
方法一:
jquery方法
movepage($('body'));
function movepage(dom) {
var starty, movey, movespave;
dom.on("touchstart", function(e) {
starty = e.originalevent.touches[0].pagey; return starty;
});
dom.on("touchmove", function(e) {
movey = e.originalevent.touches[0].pagey;
movespave = starty - movey;
if (movespave > 15) {
location.href = 'main.html'; /* 跳转到main.html */
}
});
}
方法二:
原生方法
var strat,move,num; /*定义三个变量, 记录开始、结束距离顶部的距离*/
div_demo.addeventlistener("touchstart", function (e){ /*触摸开始*/
console.log("触摸开始")
// console.log(e)
start = e.touches[0].pagey;
console.log(start) /*得出刚触屏时距离页面顶部的距离*/
})
div_demo.addeventlistener("touchmove", function (e){ /*触摸移动*/
console.log("触摸移动")
// console.log(e)
move = e.touches[0].pagey;
console.log(move) /*得出触屏结束后距离页面顶部的距离*/
})
div_demo.addeventlistener("touchend", function (e){ /*触摸结束*/
console.log("触摸结束")
// console.log(e)
num = start - move ; /*得出开始和结束距离页面顶部的差值*/
if(num>15){
location.href="main.html" /* 跳转到main.html */
}
})
推荐阅读