美文网首页
上滑触发事件

上滑触发事件

作者: Rose_yang | 来源:发表于2019-08-15 15:30 被阅读0次
      onTouchStart(event) {

            this.deltaY = 0;
            this.direction = '';
            this.startX = event.touches[0].clientX;
            this.startY = event.touches[0].clientY;
        },
        onTouchMove(event) {
            let ifBottom = this.ifAtBottom();
            this.direction = this.direction || this.getDirection(event.touches[0]);

            if (ifBottom && this.direction === 'vertical') {
                this.deltaY = event.touches[0].clientY - this.startY;
            }
        },
        onTouchEnd() {
            let ifBottom = this.ifAtBottom();
            if (!this.ifLoadMore) {
                if (ifBottom && this.deltaY && this.deltaY <= -50) {
                    if (this.activeTabIndex >= this.count - 1) {
                        return;
                    }
                    this.activeTabIndex += 1;
                    this.setScrollTop(this.bannerHeight);
                }

            }
}
getScrollTop () {
            let scrollTop = 0;
            if (document.documentElement && document.documentElement.scrollTop) {
                scrollTop = document.documentElement.scrollTop;
            } else if (document.body) {
                scrollTop = document.body.scrollTop;
            }
            return scrollTop;
        },
        setScrollTop (top) {
            if (document.documentElement && document.documentElement.scrollTop) {
                document.documentElement.scrollTop = top;
            } else if (document.body) {
                document.body.scrollTop = top;
            }
        },

// 上滑查看时继续加载 在scroll事件中处理

相关文章

  • 上滑触发事件

    // 上滑查看时继续加载 在scroll事件中处理

  • Bootstrap学习

    移动端的js事件 1、touchstart: //手指放到屏幕上时触发2、touchmove: //手指在屏幕上滑...

  • jQuery自定义事件,事件冒泡,节点

    主动触发与自定义事件 主动触发 使用jquery对象上的trigger方法来触发对象上绑定的事件。 自定义事件 除...

  • 绑定事件bind

    click 主动触发与自定义事件 主动触发 可使用jquery对象上的trigger方法来触发对象上绑定的事件。 ...

  • tableview cell 侧滑删除& 多选 2020-05-

    需要用到的方法 ios 11.0 及以上会有左滑自动触发删除特性,低版本 需要手动点击触发删除事件

  • 父组件触发子组件的事件

    子组件上ref 写好值。父组件上写一个触发事件,这个事件触发子组件的事件例如父组件 子组件ordernum

  • 事件与冒泡 --(微信小程序)

    1、事件分类 冒泡事件:当一个组件上的事件被触发后,该事件会向父节点传递。非冒泡事件:当一个组件上的事件被触发后,...

  • dom事件机制

    事件触发三阶段window 往事件触发处传播,遇到注册的捕获事件会触发传播到事件触发处时触发注册的事件从事件触发处...

  • 事件

    事件触发方法:onclick="单击触发事件";ondblclick="双击触发事件";onmousedown="...

  • 事件

    事件触发的三个阶段: window 往事件触发处传播,遇到注册的捕获事件会触发 传播到事件触发处时触发注册的事件 ...

网友评论

      本文标题:上滑触发事件

      本文链接:https://www.haomeiwen.com/subject/cirqjftx.html