Lu-Lu

文来自:https://blog.csdn.net/qq_43369797/article/details/98966790

功能:

 

 

 HTML:

 

 

 js:

scrollEvent(e) {
        let scrollItems = document.querySelectorAll(\'.condition-container\')
        for (let i = scrollItems.length - 1; i >= 0; i--) {
          // 判断滚动条滚动距离是否大于当前滚动项可滚动距离
          let judge = e.target.scrollTop >= scrollItems[i].offsetTop - scrollItems[0].offsetTop
          if (judge) {
            this.activeClass = i
            break
          }
        }
        // 滚动条触底了
        if (e.srcElement.scrollTop + e.srcElement.offsetHeight === e.srcElement.scrollHeight) {
          this.activeClass = 4 - 1
        }
      },
      getActiveClass(index) {
        this.activeClass = index
        let jump = document.querySelectorAll(\'.condition-container\')
        jump[index].scrollIntoView({ block: \'start\', behavior: \'smooth\' })
      }

 

分类:

技术点:

相关文章:

  • 2022-02-04
  • 2022-02-16
  • 2021-12-15
  • 2022-02-06
  • 2022-12-23
  • 2022-02-19
  • 2022-01-13
猜你喜欢
  • 2021-11-19
  • 2022-02-05
  • 2021-06-24
  • 2021-12-14
  • 2022-12-23
  • 2021-12-26
  • 2022-01-17
相关资源
相似解决方案