滾動時找到滾動位置

Question

我正在使用此庫進行滾動https://kingsora.github.io 。 你怎么知道元素完全滾動了？ 我只能確定滾動 = 0 的初始點，但是你怎么知道元素滾動到最后呢？

var instance = $("#road-scroll")
 .overlayScrollbars({
  callbacks: {
   onScrollStop: function(e) {
    scrollLeft = e.target.scrollLeft;

    if (scrollLeft === 0) {
      btnL.removeClass("btn-active");
    }

    if (scrollLeft > 0) {
      btnL.addClass("btn-active");
    }

  }
 }
})
.overlayScrollbars();

Answer 1

回答：

 var instance = $("#road-scroll")
  .overlayScrollbars({
  callbacks: {
   onScrollStop: function(e) {
    scrollLeft = e.target.scrollLeft;
    var scrollInfo = instance.scroll();
    let max = scrollInfo.x.max;

    if (scrollLeft === 0) {
      btnL.removeClass("btn-active");
    }

    if (scrollLeft > 0) {
      btnL.addClass("btn-active");
    }

    if (scrollLeft >= max) {
      btnR.removeClass("btn-active");
    }

    if (scrollLeft < max) {
      btnR.addClass("btn-active");
    }

   }
  }
 })
.overlayScrollbars();

Answer 2

根據@Андрей Охотников 的回答，答案實際上應該是<instance>.scroll.max.x而不是x.max ：

const scrollBar = $(jsScrollPageContainer).overlayScrollbars({
    className: "os-theme-dark",
    callbacks: {
        onScroll: function(e) {
            const scrollInfo = scrollBar.scroll();
            const max = scrollInfo.max.x;
            const scrollLeft = e.target.scrollLeft; // same as `scrollInfo.position.x`
            const scrollTop = e.target.scrollTop; // same as `scrollInfo.position.y`

            // other logic
        }
    }
}).overlayScrollbars();

完整對象供參考：