I have problem with this case:

I have a long text content and next to it a few photos ( x value) in absolute position. I need to make a script that will change the photo depending on the text scroll.

Example:

when we have three photos:

1. At the start we always show the first one
2. When we scroll text 33% and less than 66% of the text, we show the second picture
3. When we scroll text more than 66% of the text, we show the third image

The problem is that the customer can set any number of photos.

I am asking for help in writing a specific conditional instruction that will allow me to display a specific photo depending on where we are in text.

Similar example: https://codepen.io/akapowl/pen/9d0d9e474a12885298166cac5d1aa134

I know the progressText ( with GSAP) of the read text.

Example for three photos:

let imagesCountValue = 3 // 
let imagesCountProgress = imagesCountValue / 3
 
 if (progressText >= imagesCountProgress && progressText < imagesCountProgress * 2) {
      // show second photo
  } elseif( progressText > imagesCountProgress * 2 ) {
    // show third photo
  } else {
    // show first photo?
  }

How do I make an if for any number of photos?