h5 div 双指放大缩小

var num = 1

 

$("body").on("touchmove",function(e){
// e.preventDefault();
// 一根 手指 执行 目标元素移动 操作
// console.log(e)
if (e.originalEvent.touches.length == 1 ) {};

// 2 根 手指执行 目标元素放大操作
if (e.originalEvent.touches.length >= 2 ) {
// alert("2")
//得到第二组两个点
var now = e.originalEvent.touches;
Math.abs(e.originalEvent.touches[0].pageX-e.originalEvent.touches[1].pageX)

console.log('前面:'+getDistance(now[0], now[1]))
console.log('后面:'+getDistance(start[0], start[1]))
// 当前距离变小, getDistance 是勾股定理的一个方法
if(getDistance(now[0], now[1]) < getDistance(start[0], start[1])){
// console.log(getDistance(now[0], now[1]))
//缩小
if(num>0.4){
num-=0.01
$('body').css('transform','scale('+num+')')
}


}else{

//放大
if(num<2){
num+=0.01
$('body').css('transform','scale('+num+')')
}

};
};
})
function getDistance(p1, p2) {
var x = p2.pageX - p1.pageX,
y = p2.pageY - p1.pageY;
return Math.sqrt((x * x) + (y * y));
};

posted @ 2020-05-26 14:59  蒲涛-  阅读(4428)  评论(0编辑  收藏  举报