Custom Scroll Progress

[tobimori]

I want to customize the behaviour of instance.scrollProgress().

Current behaviour:
3 Entries, no loop mode:
First entry - 0%
Second entry - 50%
Third entry - 100%

What I want:
First entry - 33%
Second entry - 67%
Third entry - 100%

I can't use selectedScrollSnap() as this doesn't show me a correct value "in transition".

[tobimori]

Managed to solve it like this:

    const count = this.instance?.slideNodes().length ?? 1
    el.style.transform = `translate3d(${el.clientWidth / count}px,0px,0px)`

    this.instance?.on('scroll', () => {
      if (!this.instance) return

      el.style.transform = `translate3d(${Math.min(
        el.clientWidth,
        Math.max(
          (this.instance.internalEngine().location.get() / count) * -1 + el.clientWidth / count,
          0
        )
      )}px,0px,0px)`
    })

Note that in this case, my progress is exactly the same width as one image.