Hello, I'm new to gsap, but I managed to make a horizontal scroll together with smoothscroll, but I have one problem, I need the effects in the horizontal scroll to move horizontally and not vertically, how can I do it? I want to have it similar to this website https://zandbeek.com/
This is the code I'm using now:
gsap.registerPlugin(ScrollTrigger, ScrollSmoother);
const smoother = ScrollSmoother.create({
wrapper: "#smooth-wrapper",
content: "#smooth-content",
smooth: 2,
normalizeScroll: true,
effects: true,
preventDefault: true
});
//Horizontal Scroll
let sections = gsap.utils.toArray(".box");
let scrollTween = gsap.to(sections, {
xPercent: -100 * (sections.length - 1),
ease: "none", // <-- IMPORTANT!
scrollTrigger: {
trigger: ".scroll-container",
pin: true,
scrub: 2 ,
markers: true,
invalidateOnRefresh: true,
end: "+=4000"
}
});