imamiddin
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by imamiddin
-
-
i am using Gsap scroll trigger on horizontal scroll andscrollify jquery function for section slide. the issue is when we back bottom section to gsap section its trigger scroll without any mouse event fire
Scroll Trigger fire delay options
in GSAP
Posted
I am usoing this in my project so
gsap.registerPlugin(ScrollTrigger);
ScrollTrigger.saveStyles(".sticky-container");
/*** Different ScrollTrigger setups for various screen sizes (media queries) ***/
ScrollTrigger.matchMedia({
"(min-width: 768px)": function() {
let sections = gsap.utils.toArray(".box-container .hm-animation-sec");
gsap.to(sections, {
xPercent: -100 * (sections.length - 1),
ease: "none",
scrollTrigger: {
trigger: ".sticky-container",
pin: true,
// start: "top +=0px",
start: "top 0%",
markers: false,
scrub: 2,
snap: {
snapTo: 1 / (sections.length - 1),
duration: {min: 0.1, max: 0.3},
delay: 0
},
end: "+=2500",
}
});
},
// mobile
"(max-width: 767px)": function() {
let sections = gsap.utils.toArray(".box-container .hm-animation-sec");
gsap.to(sections, {
xPercent: -100 * (sections.length - 1),
ease: "none",
scrollTrigger: {
trigger: ".sticky-container",
pin: true,
pinSpacing: true,
// start: "top +=0px",
start: "top 0%",
markers: false,
scrub: 1,
snap: {
snapTo: 1 / (sections.length - 1),
duration: {min: 0.2, max: 0.2},
delay: 0
},
// end: () => "+=" + (document.querySelector(".container").offsetWidth / 5)
end: "+=2500"
}
});
},
// all
"all": function() {
}
});