zoukankan      html  css  js  c++  java
  • HTML5 touche vents drag to move & AF actionsheet by longTap

     $('img').on("touchstart",function(E){
                                //E.preventDefault();E.stopPropagation();
                                var el=this;var me=$(this);$("#tip").text("in touchstart");
                                var t=E.touches[0];
                                console.log("touchstart!,mx,my=(",t.pageX,",",t.pageY,") ,el.x,y=(",el.offsetLeft,",",el.offsetTop,")" );
                                        me.data("mx",t.pageX);me.data("my",t.pageY);
                                        me.data("ex",el.offsetLeft);me.data("ey",el.offsetTop);
    
                            })
                            .on('touchmove',function(E){E.preventDefault();E.stopPropagation();
                                console.log("touchmove");var el=this;var me=$(this);
                                var t=E.touches[0];
                                var mx=parseInt(me.data("mx")),my=parseInt(me.data("my"));
                                var ex=parseInt(me.data("ex")),ey=parseInt(me.data("ey"));
                                console.log("or mx,my, new mx,my or ex,ey=",mx,my,t.pageX,t.pageY,ex,ey)
                                var nx=ex+t.pageX - mx , ny=ey+t.pageY-my
                                console.log("dest x,y=",nx,",",ny)
                                $("#tip").text("in touch move : "+"or mx,my, new mx,my or ex,ey="+mx+","+my+","+t.pageX+","+t.pageY+","+ex+","+ey+" dest x,y="+nx+","+ny);
                                me.css({"left":nx+"px","top":ny+"px"}) ;
    
                            })
                            .on('touchend',function(E){
                                //E.preventDefault();E.stopPropagation();
                                 console.log('touchend');var el=this;var me=$(this);
                            });
                            
                            $('img').on('longTap',function(){$.ui.actionsheet(
                                [{
                                    text: 'back',
                                    cssClasses: 'red',
                                    handler: function () {
                                        alert("Clicked Back")
                                    }
                                }, {
                                    text: 'Alert Hi',
                                    cssClasses: 'blue',
                                    handler: function () {
                                        alert("Hi");
                                    }
                                }, {
                                    text: 'Alert Goodbye',
                                    cssClasses: '',
                                    handler: function () {
                                        alert("Goodbye");
                                    }
                                }]
                            );
                            });
    
  • 相关阅读:
    KMP算法小结
    算法二叉搜索树之AVL树
    算法导论之红黑树的学习
    算法导论小结(一)
    感悟或摘抄
    js中神奇的东西
    简单了解webservice
    用<![CDATA[]]>将xml转义为 纯文本
    简单了解soap协议
    java写webservice接口
  • 原文地址:https://www.cnblogs.com/dajianshi/p/4293622.html
Copyright © 2011-2022 走看看