Jump to content
Search Community

Delarge

Members
  • Posts

    6
  • Joined

  • Last visited

Everything posted by Delarge

  1. In addition, I think recapping on what 'yoyo' really means is useful, it counts as a separate tween(?) I was approaching it as yoyo means run it forward then back and it all counts as 1 'run through'. So doing that repeat: 1 in the stagger object in the first example is what I was missing as well.
  2. Thank you akapowl, both solutions solve my issue. The first is clean but the second was how I was thinking of it, but I was doing a 2nd timeline instead of just a 2nd tween and also missing the positon parameter if I remember right. And yes, I will make any furture pens forkable, I didn't notice the private setting was on, thanks. For me, GSAP is something I won't need to use for a while, then suddenly a project needs it and you're back in it - bang! Whilst it is easy to pick back up again, some of the basics get rusty. Thanks again!
  3. Hi, this has been driving me a little bit mad as it seems so simple, I get so close, but I think I'm just one line or setting away. The codepen demo best shows where I'm at. For each circle I need to go, scale up, scale down, stagger each one, stop at the end, wait for 1 second, do it all again. My codepen is almost there, just doesn't scale them back down. I've tried nested timelines to handle the grow and shrink, yoyo in various places - which isn't quite right as it pauses after each play/direction. Any help would be greatly appreciated. Thanks so much!
  4. Hi, is it possible to get the ScrollTrigger offscreen reset technique (good demo on another post) working with scrub? My code, which almost works, is: const anim_supersonic_image_1 = gsap.from("#supersonic-image-1", { opacity:0, x: 80, duration:1, ease: "back(1)", paused: true, scale: 1.1, perspective: 250, rotateX: -15, rotateY: 30, }) const play_anim_supersonic_image_1 = ScrollTrigger.create({ trigger: "#supersonic-image-1", scrub: 1, // <---- BEING IGNORED start:"top 70%", onEnter: () => anim_supersonic_image_1.play() }); const reset_anim_supersonic_image_1 = ScrollTrigger.create({ trigger:'#supersonic-image-1', onLeaveBack: () => anim_supersonic_image_1.pause(0) }); See my note about 'BEING IGNORED'? Where am I going wrong here? Many thanks!
  5. Thank you, Carl! Brilliant and very helpful video as always. toggleActions: "play complete reset reset" is what I'm after in this instance (of course!), but great to know those other options are there.
  6. Firstly, apologies if this has already been asked, I tried to find previous posts but suspect I wasn't looking for quite the correct terms. I have a loooong page using a mixture of regular ScrollTrigger animations + timelines - but I also have a fixed menu at the side that jumps you down to various anchor linked sections. So if someone starts the page and clicks the link to #section-5, can I stop all the animations on the way from the top to bottom from firing? Many thanks!
×
×
  • Create New...