移动浏览器手势事件代码,JS代码库,德仔网

代码语言

代码分类

【JS】移动浏览器手势事件

作者:BeanZhou / 发布于2014/7/17/ 730


	<!doctype html>
	<html lang="en">
	<head>
	 <meta charset="UTF-8">
	 <title>Document</title>
	</head>
	<script src="jquery-1.7.2.js"></script>
	<script src="jgestures.js"></script>
	<script>
	$(function(){
	var tstarty,tendy
	function touches(ev){
	
	 var oDiv=document.getElementById('div1');
	 switch(ev.type){
	 case 'touchstart':
	 oDiv.innerHTML='Touch start('+ev.touches[0].clientX+', '+ev.touches[0].clientY+')';
	 ev.preventDefault(); //阻止出现滚动条
	 tstarty = ev.touches[0].clientY;
	 break;
	 case 'touchend':
	 oDiv.innerHTML='Touch end('+ev.changedTouches[0].clientX+', '+ev.changedTouches[0].clientY+')';
	 break;
	 case 'touchmove':
	 oDiv.innerHTML='Touch move('+ev.changedTouches[0].clientX+', '+ev.changedTouches[0].clientY+')';
	 break;
	 case 'touchcancel':
	 oDiv.innerHTML='Touch cancel('+ev.changedTouches[0].clientX+', '+ev.changedTouches[0].clientY+')';
	
	 break;
	
	 }
	
	}
	document.addEventListener('touchstart',touches,false);
	document.addEventListener('touchend',touches,false);
	document.addEventListener('touchmove',touches,false);
	document.addEventListener('touchcancel',touches,false);
	});
	
	</script>
	<style>
	 #tme{width: 300px;height:200px;background-color: #454545;}
	</style>
	<body>
	 <div id="tme"></div>
	 <div id="div1"></div>
	</body>
	</html>

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　移动浏览器手　　势事件　

同语言下

可能有用的

BeanZhou贡献的其它代码(2)