js实现表格自动滚动效果（鼠标悬浮在表格上 暂停滚动，鼠标移开继续滚动）

//全局定义变量
let timer ="";//保存监听
let dom = null;//保存dom元素

//获取dom元素：
 this.$nextTick(() => {
      dom = document.getElementById('OledLefttable');//获取的table元素
      this.run();
    })



//方法


closePop(){//关闭弹窗触发
      this.run(true);
    },
    listenerMethod(){
        clearInterval(timer);
    },
    runRoll(){
        clearInterval(timer);
        this.run();
    },
run(isPop = false) {
      if(isPop){
        clearInterval(timer);
        dom.removeEventListener('mouseover',this.listenerMethod);
        dom.removeEventListener('mouseout',this.runRoll)
      }
      if(dom == null){
        return
      }
      timer = setInterval(() => {
        dom.scrollTop = dom.scrollTop += 2;
        //判断是否滚动到底部
        if (Math.floor(dom.scrollHeight - dom.scrollTop) === dom.clientHeight) {
          dom.scrollTop = 0; //置为0  继续滚动
        }
      }, 100)

      dom.addEventListener('mouseover',this.listenerMethod)
      dom.addEventListener('mouseout',this.runRoll)
    },

最后

以上就是认真发箍为你收集整理的js实现表格自动滚动效果（鼠标悬浮在表格上 暂停滚动，鼠标移开继续滚动）的全部内容，希望文章能够帮你解决js实现表格自动滚动效果（鼠标悬浮在表格上 暂停滚动，鼠标移开继续滚动）所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。