Hey,
I am desperately searching for a way to play one step of my timeline when the a mouse scroll gets started. All methods that I have found trigger the events multiple times on scroll and gsap gets really confused.
Is there a convient way to build something like that with greensock?
What I want to build is a animation triggered webapp like these:
https://theshift.tokyo/
http://www.contiducco.it/index.php?route=common/home
My Code at the moment:
$(window).bind("mousewheel DOMMouseScroll", function(event) {
var docTimeline = new TimelineLite({ paused: true });
docTimeline.add(TweenLite.to(".lightLogo", 1, { y: "200%" }));
docTimeline.add(TweenLite.to(".text", 1, { x: "0%" }));
// Events when scrolled down.
if (
event.originalEvent.wheelDelta < 0 ||
event.originalEvent.detail > 0
) {
docTimeline.play();
} else {
docTimeline.reverse();
}
});