First posted on stack overflow here - sorry to post here, but i didnt have much luck there.
https://stackoverflow.com/questions/75504739/layered-scrollify-sections-with-same-background-image

I have the following page structure that I need to have sections scrolled to (using scrollify hopefully)

Hero video with background A (standard section)
Section with text A and background B
Section with text B and background B
Section with text C and background B
Section with Image B (standard section)
Section with Image C (standard section)
Section with Image D (standard section)

I have the sections working using scrollify for the non italic sections above, but is it possible to add the three sections with different text and the same background? In a similar way to the layered example here (which seems to have no example code)?

https://projects.lukehaas.me/scrollify/examples/layered-scrolling/

So on each scroll between italic sections, the text is replaced from A to B to C, but the background stays the same as B each time? And then after that goes back to the standard flow..

Here is my scrollify code -

$.scrollify({
section: ".section_wrap",
sectionName: "section-name",
interstitialSection: "",
easing: "easeOutExpo",
scrollSpeed: 600,
offset: 0,
scrollbars: true,
standardScrollElements: ".section-approach .section-projects .section-team",
updateHash: false,
});
Other info - this is a wordpress site that also has bootstrap 5.

cheers david