gpt4 book ai didi

javascript - 如何使用 jQuery Mobile 滑动事件获取方向和距离

转载 作者:数据小太阳 更新时间:2023-10-29 05:08:12 27 4
gpt4 key购买 nike

使用 jQuery Mobiles 滑动事件时,是否可以在回调函数中获取方向和距离?我在 official docs 中没有找到任何相关信息.

TouchSwipe是一个不错的选择,但我需要 tap 事件表单 jQuery Mobile,我不想包含两个库。

最佳答案

工作示例:http://jsfiddle.net/Gajotres/K69AJ/

这个例子是用 jQuery Mobile 事件制作的,所以它只适用于 jQuery Mobile。在 Windows 和 Android 平台上测试。

Vmouse 事件旨在弥合桌面浏览器和移动浏览器之间的差异。

还要注意这一行:

event.preventDefault();

它是 Android 平台所必需的,该平台有一个严重的触摸移动检测错误。错误报告:http://code.google.com/p/android/issues/detail?id=19827

var gnStartX = 0;
var gnStartY = 0;
var gnEndX = 0;
var gnEndY = 0;

$(document).on('vmousedown', function(event){
gnStartX = event.pageX;
gnStartY = event.pageY;
event.preventDefault();
});

$(document).on('vmouseup', function(event){
gnEndX = event.pageX;
gnEndY = event.pageY;
var distance = Math.ceil(nthroot(Math.pow((gnEndX - gnStartX),2) + Math.pow((gnEndY - gnStartY),2), 2));

if(Math.abs(gnEndX - gnStartX) > Math.abs(gnEndY - gnStartY)) {
if(gnEndX > gnStartX) {
alert("Swipe Right - Distance " + distance + 'px');
} else {
alert("Swipe Left - Distance " + distance + 'px');
}
} else {
if(gnEndY > gnStartY) {
alert("Swipe Bottom - Distance " + distance + 'px');
} else {
alert("Swipe Top - Distance " + distance + 'px');
}
}

event.preventDefault();
});

function nthroot(x, n) {
try {
var negate = n % 2 == 1 && x < 0;
if(negate)
x = -x;
var possible = Math.pow(x, 1 / n);
n = Math.pow(possible, n);
if(Math.abs(x - n) < 1 && (x > 0 == n > 0))
return negate ? -possible : possible;
} catch(e){}
}

关于javascript - 如何使用 jQuery Mobile 滑动事件获取方向和距离,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16416033/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com