html5移动端：手机触控gesturestart（js）

最新推荐文章于 2024-08-19 10:06:43 发布

u010242159

最新推荐文章于 2024-08-19 10:06:43 发布

阅读量2.9k

点赞数

本文链接：https://blog.csdn.net/u010242159/article/details/52385715

版权

本文介绍了HTML5中与触控相关的touch和gesture事件，详细解析了touchstart、touchend、touchmove和touchcancel事件，以及如何获取和理解触点信息，包括touches、targetTouches和changedTouches列表。还提到了在多点触摸设备上，如何利用这些事件和信息来实现更复杂的交互，例如JavaScript版的超级玛丽游戏。最后指出，通过调用touchmove事件对象的preventDefault方法可以防止页面在手指移动时滚动。

摘要由CSDN通过智能技术生成

<!doctype html>
<html>
<head>
<title>Mobile Cookbook</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
html, body {
padding: none;
margin: none;
}
</style>

</head>
<body>
<div id="a">手机旋转 jquery
</div>
<script>
var metas = document.getElementsByTagName('meta');
var i;
if (navigator.userAgent.match(/iPhone/i)) {
alert(navigator.userAgent.match(/iPhone/i));
for (i=0; i<metas.length; i++) {
if (metas[i].name == "viewport") {
metas[i].content = "width=device-width, minimum-scale=1.0, maximum-scale=1.0";
}
}
document.addEventListener("gesturestart", gestureStart, false);
}
function gestureStart() {