zepto touch 拖动元素,获取移动坐标

论坛 期权论坛 编程之家     
选择匿名的用户   2021-6-2 17:54   1800   0

<div id="m" style="position:absolute;width: 100px;height: 100px;background: red"></div>

<script type="text/javascript">



var start_piont,end_point,delta_x,delta_y; 


$(document).ready(function(){
 
 $("#m").on("touchstart",function(e){
     var touch = e.touches[0];  
     start_piont = {  
         x: touch.pageX,  
         y: touch.pageY  
     }
     console.log(start_piont);
     $("#m").css("top",touch.pageY);
     $("#m").css("left",touch.pageX);
 }).bind('touchmove',function(e){
     //在这里不断刷新
      var touch = e.touches[0];  
      end_point = {  
          x: touch.pageX,  
          y: touch.pageY  
      }
     console.log(end_point);
     $("#m").css("top",touch.pageY);
     $("#m").css("left",touch.pageX);
 }).bind('touchend', function(e){

     //在这里取值计算
     delta_x = end_point.x - start_piont.x;  
     delta_y = end_point.y - start_piont.y; 

     console.log(delta_x);
     console.log(delta_y);
 }); 
});

</script> 
 

分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:3875789
帖子:775174
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP