Jump to content
Search Community

Pixel-people

Business
  • Posts

    3
  • Joined

  • Last visited

About Pixel-people

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

Pixel-people's Achievements

  1. Sorry to bump this topic, but i got the same issue as described. Already using the available "solution", but its not working for me. Pausing and playing the master timeline does not work. // Create a new TL let masterTimeline = gsap.timeline({ paused: true }); // Added two timelines (functions will return tl) masterTimeline.add( new animateBackground().add(new menuAnimation(), "-=60%") ); // Added an event to start playing the master timeline trigger.addEventListener("click", () => { masterTimeline.play(); }); - Master timeline variable is available within the event function - Master timeline works as aspected within the page load, but as described the play/pause methodes are not working. Is there something i overlooked? Package business@^3.11.5 Edit: Used:import gsap from "gsap"; Changed to the CDN, and the master timeline is working
  2. Hi Guys, Sorry for not attaching a codepen, but i cant find the CDN for CSSRule to work properly. When Scrolltrigger hits the end of the trigger element it looks like the animation will go to the starting position. Is it possible to hold the current state when scrollTigger end is hit / out of view Code example timeline: let tl = gsap.timeline({ scrollTrigger: { trigger: shade, start: "top center", end: "bottom bottom", pin: false, }, }); Code from position: tl.from(background, { width: "0", duration: 1, ease: "elastic.out(1, 0.3)", }); Current CSS &:before { width: calc(100% + 1.5rem); left: -20px; background-color: $primary; } Issue: after the end hits, the animation will set back to the from position, but i want to hold the current CSS position.
  3. Hi Guys, I've rewrite the code several times, hope someone could steer me in the right direction. Codepen scrollTrigger works as aspected, but when i use the same code on staging, scrollTrigger wil not trigger. Could i turn on a debug-mode for scrollTrigger? Already checked: - Animation works without scrollTrigger in the timeline. - Devtools bar would play the animation when in view - No console log error - With scrub: true, scrollTrigger will trigger Element(s) to trigger What can i do to make this work? Solution: looks like a need a start and end point. Still curious why codepen is working and dev-env start/end needed.
×
×
  • Create New...