touch简单介绍

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.box{
width: 500px;
height: 500px;
border: 1px solid red;
}
</style>
</head>
<body>
<div class="box"></div>
<script>
<!--
touchstart

changedTouches 改变后的触摸点集合
targetTouches 当前元素的触发点集合
touches 页面上所有触发点集合

touchend targetTouches/touches length为0

e.touches[0] 第一个触摸点
-->
window.onload=function () {
var box=document.querySelector(".box");
box.addEventListener("touchstart",function (e) {
console.log(e);
console.log("start");
})
box.addEventListener("touchmove",function (e) {
console.log(e);
console.log("move");
})
box.addEventListener("touchend",function () {
console.log("end");
})
}
</script>
</body>
</html>
posted @ 2019-08-10 15:18  Hi前端  阅读(205)  评论(0编辑  收藏  举报