鍍金池/ 問答/HTML/ jq怎么監(jiān)聽手機(jī)右滑座滑操作?

jq怎么監(jiān)聽手機(jī)右滑座滑操作?

怎么監(jiān)聽手從左向右滑動(dòng)這個(gè)div,我想滑動(dòng)后右側(cè)出現(xiàn)刪除按鈕
clipboard.png

回答
編輯回答
心癌

監(jiān)聽touchstart事件,獲取手指剛觸摸屏幕的坐標(biāo)位置主要是X軸,touchmove時(shí)獲取手機(jī)X坐標(biāo),從左向右滑動(dòng)的話后者減去前者應(yīng)該是個(gè)正值,當(dāng)兩者之差超過某一數(shù)值時(shí),讓div的translateX改變

            obj.addEventListener('touchstart', function(event) { 
            if (event.targetTouches.length == 1) { 
            var touch = event.targetTouches[0]; 
            var startX=touch.pageX; 
            var disX;
            obj.addEventListener('touchmove',move);  
            function move(event){    
                event.preventDefault();
                    var touch2=event.targetTouches[0];
                    var moveX=touch2.pageX;
                    disX =  moveX - startX;        
                    console.log(disX );        
                    ........
         
            };
              obj.addEventListener('touchend',chend);
              function chend(event){
                obj.removeEventListener('touchmove',move);
                obj.removeEventListener('touchend',chend);
              };
        }; 
        }, false);
2017年10月13日 19:33
編輯回答
哎呦喂

這跟jQ關(guān)系不大,畢竟jQ核心只負(fù)責(zé)DOM操作。觸摸的東西你可以去找個(gè)手勢庫來做,比如可以用zepto加它的touch模塊;也可以單獨(dú)用第三方的手勢庫,然后用右滑事件回調(diào)來做。

2018年4月5日 04:21