Jump to content

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


  • Posts

  • Joined

  • Last visited

About NickNo

Contact Methods

Profile Information

  • Gender
  • Location
    New Zealand

Recent Profile Visitors

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

NickNo's Achievements

  1. I've got this animation running where I want the red line to animate to 100% width once the second line of SplitText has animated in... I've tried setting an active class using a callback - but can't figure out how to get it to fire just on the second line - as I've got it, it fires every time....any help appreciated
  2. Actually, one question on this - how would I restrict the draggable movement to its parent? If I use bounds:'.timeline-year' that restricts all items to the very first timeline-year box...I thought something like 'bounds: this.target.parentNode' but that doesn't work...
  3. Hi, I have multiple draggables, and just wondering how to stop movement on one when another is in play. In the example - the pink timeline should drag everything on it (the dots) - but if dragging a dot, the pink timeline shouldn't move... Thanks for any advice
  4. haha, thanks Jack, that looks like it's worked.... Just after I posted it I thought "maybe I'll remove the will-change and see what happens..." then got distracted
  5. I'm noticing this issue in chrome where any blocks of text (or nav's etc) that have been animated are just slightly blurry - just enough that I wonder if I just need to clean my glasses I don't notice it in other browsers - and I've found some old stuff in the forums relating to force3d:"auto", but that doesn't seem to have any effect. Is this something that others have dealt with? Any recent updates on this issue? In the codepen below - a static block followed by an animated block to see the difference... Thanks
  6. NickNo

    Converting gsap2->3

    Hey that's great thanks Jack - thanks for the very helpful response!
  7. Hi, I'm having a little trouble converting an old codepen over to gsap3 ... I thought I had it covered - but the transition has messed up - I have lost the skew and the back animation isn't right .... any suggestions? GSAP3 version https://codepen.io/nickjacobsnz/pen/jOVoqKy GSAP2 version https://codepen.io/nickjacobsnz/pen/zYZXMJm
  8. Hi, I've got a page with a bunch of objects that fade in on scroll - then a bunch of galleries. What I want to happen is to click a 'load more' and then next set of gallery items animate in. The way I've (quickly) set it up doesn't work - I'm just wondering if I'm on the right track, or do I not even use scrolltrigger, and use something else to do this?
  9. Thanks Zach, and sorry for the vague-ness - part of my question was how to actually stop all (including the hint which was nested)- I ended up using var root=gsap.exportRoot(); root.pause(); Just for my own understanding - in that start button click - changing from my function call to your on('click', startGlobal) stopped the double up of the animation - why is that?
  10. Hi, I'm trying to get my head around the best way to structure gsap when it comes to multiple tweens/timelines, and also controlling interactions between these and events on the page... This stripped down example is from a project where I've got multiple separate animations going on in an overlay window - they start when the window opens - when I close the window I want to kill all the animations. My issue is just getting my head around the best way to structure it and call timeline functions from inside other functions etc...(and I do realise the problems here might just be a general noobness and lack of understanding of scope etc..) Also, you'll see if you press start a couple of times it looks like the timeline doubles up or something - is there a way to stop any currently running animation that might be occurring on an instance of a timeline? So, if one of the awesome helpful and patient regular contributors could point me in the right direction....:)
  11. Beauty, thats cracked it And, "check your bloody SVGs" comment noted
  12. Thanks for the quick reply Zach, but you've lost me - where is that existing transform coming from (there's nothing in the html/css) - or do you mean the transformOrigin gsap is doing?