document.addEventListener('touchstart',function(ev){
ev.preventDefault();
});
var box=document.getElementById("box");
box.addEventListener('touchstart',function(){
this.innerHTML='手指按下了';
});
box.addEventListener('touchmove',function(){
this.innerHTML='手指移动了';
});
box.addEventListener('touchend',function(){
this.innerHTML='手指离开了';
});
var box=document.getElementById("box");
//相当于mousedown
box.addEventListener('touchstart',function(ev){
//console.log(ev.touches);
this.innerHTML=ev.touches.length;//按下手指数
});
window.addEventListener('devicemotion',function(ev){
var motion=ev.accelerationIncludingGravity; box.innerHTML='x:'+motion.x+'<br/>'+'y:'+motion.y+'<br/>'+'z:'+motion.z;
});
window.addEventListener('devicemotion',function(ev){
var motion=ev.accelerationIncludingGravity;
var x=parseFloat(getComputedStyle(box).left);//box目前的left值
box.style.left=x+motion.x+'px';
});
var box=document.getElementById('box');
var lastRange=0; //上一次摇晃的幅度
var isShake=false; //决定用户到底有没有大幅度摇晃
window.addEventListener('devicemotion',function(ev){
var motion=ev.accelerationIncludingGravity;
var x=Math.abs(motion.x);
var y=Math.abs(motion.y);
var z=Math.abs(motion.z);
var range=x+y+z; //当前摇晃的幅度
if(range-lastRange>100){
//这个条件成立说明用户现在已经在大幅度摇晃
isShake=true;
}
if(isShake && range<50){
//这个条件成立,说明用户摇晃的幅度很小了就要停了
box.innerHTML='摇晃了';
isShake=false;
}
});
window.addEventListener('deviceorientation',function(ev){
box.innerHTML='x轴倾斜:'+ev.beta.toFixed(1)+'</br>y轴倾斜:'+ev.gamma.toFixed(1)+'</br>z轴倾斜:'+ev.alpha.toFixed(1);
});
var startDeg=0; //上次旋转后的角度
//两个或者两个以上手指按下
box.addEventListener('gesturestart',function(){
this.style.background='blue';
//rotate(90deg)
if(this.style.transform){
startDeg=parseFloat(this.style.transform.split('(')[1]);
}
});
//两个或者两个以上手指变换
box.addEventListener('gesturechange',function(ev){
/*this.style.background='black';
this.innerHTML=ev.rotation;*/
this.style.transform='rotate('+(ev.rotation+startDeg)+'deg)';
});
//两个或者两个以上手指抬起
box.addEventListener('gestureend',function(){
this.style.background='green';
});
document.addEventListener('touchstart',function(ev){
ev.preventDefault();
});
document.addEventListener('touchmove',function(ev){
ev.preventDefault();
});
var box=document.getElementById("box");
var startScale=1; //上次缩放后的角度
//两个或者两个以上手指按下
box.addEventListener('gesturestart',function(){
this.style.background='blue';
//rotate(90deg)
if(this.style.transform){
startScale=parseFloat(this.style.transform.split('(')[1]);
}
});
//两个或者两个以上手指变换
box.addEventListener('gesturechange',function(ev){
/*this.style.background='black';
this.innerHTML=ev.rotation;*/
var sc=ev.scale*startScale;
sc=sc<0.5?0.5:sc;//设置最小缩放到0.5
this.style.transform='scale('+sc+')';
});
//两个或者两个以上手指抬起
box.addEventListener('gestureend',function(){
this.style.background='green';
});
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码(独立后台)...苏ICP备2024110244号-2 苏公网安备32050702011978号 增值电信业务经营许可证编号:苏B2-20251499 | Copyright 2018 - 2025 源码网商城 (www.ymwmall.com) 版权所有