移动端touch事件

最新推荐文章于 2023-04-28 15:41:12 发布

林中明月间。

最新推荐文章于 2023-04-28 15:41:12 发布

阅读量238

点赞数

分类专栏：移动端、兼容性、响应式

本文链接：https://blog.csdn.net/a772116804/article/details/80962333

版权

移动端、兼容性、响应式专栏收录该内容

24 篇文章 2 订阅

订阅专栏

<style>
#box{
	width: 200px;
	height: 200px;
	border: 1px solid #000;
}
</style>
</head>
<body>
<div id="box"></div>
	<script type="text/javascript">
	var div = document.getElementById('box');
	div.addEventListener('touchstart',function(event){
		// var ev = event || ev;
		event.preventDefault();
		div.style.background = 'red';
	},false);
	//touchstart 当手指触摸屏幕时
	div.addEventListener('touchmove',function(event){
		// var ev = event || ev;
		event.preventDefault();
		div.style.background = 'pink';
	},false);
	//touchmove 当手指在屏幕上移动时
	div.addEventListener('touchend',function(event){
		// var ev = event || ev;
		event.preventDefault();
		div.style.background = 'yellow';
	},false);
	//touchend 当手指划过屏幕时
	</script>
</body>