zoukankan      html  css  js  c++  java
  • jquery 判断手势滑动方向(上下左右)

    $('body').on('click', '.placeholder img', function(e) {
        //touchstart在你之前发生,不管些什么,都先执行下面的
    });
    
    $('body').on('touchstart', '#gallerySlider img', function(e) {
                var touch = e.originalEvent,
                startX = touch.changedTouches[0].pageX;
                startY = touch.changedTouches[0].pageY;
                slider.on('touchmove', function(e) {
                    e.preventDefault();
                    touch = e.originalEvent.touches[0] ||
                        e.originalEvent.changedTouches[0];
                    if (touch.pageX - startX > 10) {
                        console.log("右划");
                        slider.off('touchmove');
                        showPrevious();
                    } else if (touch.pageX - startX < -10) {
                        console.log("左划");
                        slider.off('touchmove');
                        showNext();
                    };
                    if (touch.pageY - startY > 10) {
                        console.log("下划");
                    } else if (touch.pageY - startY < -10) {
                        console.log("上划");
                    };
                });
    
                // Return false to prevent image 
                // highlighting on Android
                return false;
    
            }).on('touchend', function() {
                slider.off('touchmove');
            });
    

      

  • 相关阅读:
    父子组件例子
    指令
    使用git将代码推到coding
    vue生命周期
    vue 父子组件
    vuex
    使用vue与element组件
    vue02
    使用vue
    telnet 使用
  • 原文地址:https://www.cnblogs.com/libin-1/p/5753926.html
Copyright © 2011-2022 走看看