Jump to content

Search In
  • More options...
Find results that contain...
Find results in...


  • Posts

  • Joined

  • Last visited

About LSchneiderman

Recent Profile Visitors

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

LSchneiderman's Achievements

  1. I have a trigger that works correctly scrolling forward, but not backward. Going forward, I want the navbar to change from highlighting Part 1 to highlighting Part 2 at a certain point, then to change from highlighting Part 2 to highlighting Part 1 when you scroll backward past that point. My code doesn't work for the backward scrolling part. What am I doing wrong please?
  2. I'd like to have some elements of my project move faster on scroll than others. In this project, I'd like #screen2 to move slower than #screen3. How would I do that please?
  3. @Jack What about the token, though?
  4. We just bought Club Greensock BusinessGreen. But how do we install this? We don't have npm or yarn. We need to download it to our laptop/PCs and to our production server. We basically just want the DrawSVG plugin. How do we do this?
  5. @mikel That's great! The set seems to be what I need. If I want to fade in the ball, would I set opacity to 0 in the css and then make the set phrase read: set(".ball03",{opacity:"1"}, 2.48); How would I set the number of seconds for the animation?
  6. What if I have a dot on the line (ball03) and I only want it to appear when the line draws to that point? https://codepen.io/lschneiderman/pen/mdmNaGq?editors=1111
  7. @Cassie Thank you!! I don't know if you can help me with this tweak, but when I incorporated the path into my larger project, the circle follows the path, but when it reaches the end, it jumps back to its original, beginning spot: var action = gsap .timeline({ defaults: { duration: 9 }, scrollTrigger: { trigger: "#path-pin", start: "top top", end: "+=200%", pin: true, pinSpacing: true } }) .to(".ball01", { duration: 0.01, autoAlpha: 1 }) .from("#path", { drawSVG: 0 }, 0) .to( ".ball01", { motionPath: { path: "#path", align: '#path', alignOrigin: [0.5, 0.5] } }, 0 ); How do I make that circle just stay at the end of the svg path once it has followed the path all the way?
  8. I want to animate ball01 along the svg path, starting from behind ball02, continuing along the line and stopping at ball04. I think the svg will need to be pinned for it to stay in view while the animation is taking place. I'm using https://codepen.io/delwinh/pen/OJMRYbd as my model. What needs to change in the code for the animation to work?
  9. I'm trying to pin a div on top and then later pin something just underneath the first div. I am still very new to the whole GreenSock/ScrollTrigger world and don't have my bearings yet. Could someone help me with what am I doing wrong with these pins? I don't understand pin spacing and I wish I could use responsive spacing with percentages rather than pixels.