Streaming live at 10am (PST)

Using multiple scrollify (or other) scripts on the same page (i.e. different versions of the same script in different sections)

Hi-

I’m struggling a bit with what I feel like should be a simple issue, but is it possible to restrict a script to just a section or div?

I am trying to use different scrollify behaviours on different sections of the same page. Specifically I want to build a horizontal scroll animation that uses a faster scroll, but I can’t seem to get it to work. I’ve tried using custom code within the different sections, but the script only seems to work when I put it in front of the body tag.

I am already using a conditional script to load alternate scripts for mobile and that is working. But I’m not sure that having too many nested conditionals is an option (or is it?). I’d tried splitting the load function into the header and the call-out into sections and divs… But it doesn’t seem to work.

Any tips/pointers are greatly appreciated!

My script is below:

(script)
if (screen && screen.width > 568) {
(function() { .scrollify({
section: “.div-scroll”,
interstitialSection : “.div-interscroll”,
scrollSpeed: 2500 ,
setHeights: false ,
easing: “swing”,
updateHash: false,
offset : -30,
touchScroll: true ,
});
});
} else {
(function() { .scrollify({
section: “.div-scroll”,
interstitialSection : “.announce8x8”,
scrollSpeed: 2000 ,
setHeights: false ,
easing: “easeOutExpo”,
updateHash: false,
touchScroll: true ,
});
});
}
(/script)


Here is my public share link: ** Boheme LABhaus V1 (webflow.io)**