I am trying to implement a mobile-friendly concept which would enable a user to scrub through a sequence of images on scroll.
What I’ve laid out is the following: a series of images piled on top of each other, each subsequent frame featuring a lower z-index value than the previous one, all in a fixed position. There would be a div block which extends to a large multiple of the viewport size, 2000vh, shall we say.
These images need to be told what to do through the Interactions tool, and I can’t seem to figure out how to configure that.
I am thinking of assigning some kind of opacity-controlling page-trigger interaction set to “While Page is Scrolling”; here, an animation will be created, whose scroll action controls the opacity of each and every image in the sequence, bringing it from 100% to 0% instantly.
I think it’s possible, what do you guys think? Maybe there is a way to add every image at once?