Hi everyone 
I’m trying to create a scroll-driven interaction in Wix Studio using a Multi-State Box(#multiStateBox1) placed inside a section (#section57). This box contains four states (state1 to state4), and I want the user to scroll through the section — changing to the next state on each scroll (like a slide effect), before being able to scroll past the section.
I’ve tried using Document.on("wheel") and section.on("wheel") with changeState(), and added debounce logic, but the scroll-to-state transition still doesn’t work. The section gets passed over during regular scroll and the states don’t change as expected.
My goal is:
- Scroll inside the section triggers
.changeState()between the states - User should stay “locked” in the section until all 4 states are shown
- Ideally, it should work on both desktop and mobile
- I’m not using separate boxes, only states inside the Multi-State Box
I’ve already implemented basic scroll detection and used .changeState() to switch between the states.
I’m also updating button styles (#stateBtn1, #stateBtn2, etc.) to reflect the active state as visual indicators. Still it’s not working.
Has anyone successfully implemented this kind of interaction in Wix Studio? Or is there a workaround that works reliably with scroll input?