vue 轮播图滚动效果

74 阅读1分钟
//下一个
scrollNext() {
      if (this.fourModIndex == 3) {
        return;
      }
      this.fourModIndex++;
      let timer = setInterval(() => {
        if (this.fourModLeft <= this.fourModIndex * -115) {
          clearInterval(timer);
        } else {
          this.fourModLeft -= 2;
          this.$refs.fourModScroll.style.left = this.fourModLeft + "vw";
        }
      }, 5);
    },
    //前一个
    scrollPre() {
      if (this.fourModIndex == 0) {
        return;
      }
      let timer = setInterval(() => {
        if (this.fourModLeft >= this.fourModIndex * -115) {
          clearInterval(timer);
        } else {
          this.fourModLeft += 2;
          this.$refs.fourModScroll.style.left = this.fourModLeft + "vw";
        }
      }, 5);
      this.fourModIndex--;
    },