Jump to content


  • Posts

  • Joined

  • Last visited

Everything posted by sygad1

  1. Thanks, but that's moved away from the result i'm after This is fading in at a stationary point then moving up, pausing, moving up and again at a stationary point, fading out It might be easier to imagine the entire list wrapped around a cylinder and the cylinder is rotating The 1st item starts at the bottom and moves AND fades into the red box, pauses for 1s, then moves AND fades out at the top As each item reaches the red box, the next on the list appears and the cycle starts over By the time the 3rd item has started its animation at the bottom, the 2nd item is in the red box and the 1st item is just about to fade out at the top. The only stationary point is when an item is in the red box Hope that helps and again, cheers for the help
  2. That's a pretty cool effect, i'll have a play with that. The 3 states all visible at once would look like this
  3. it was starting from the end of the path Craig has nailed the answer, I was setting my animation 100% 100%, it should have been 0% 0% All sorted now
  4. very very close is there anyway of having 3 on screen at once, the fading out, the visible and the fading in, essentially all 3 states no big if not possible, this is close enough to what I need
  5. Hi All I've created a drawSVG but when comparing it to a vivus.js version, they start from different points, how can I control the starting points on my GSAP version? Any help appreciated
  6. Hi All Having a bit of a problem with staggered animations. I want to stagger a list so that it fades in and moves up, pauses for 1s, then fades out and moves up even more, effectively: Fades in from y:100 Pauses for 1s Fades out to y:-100 I tried with a staggerFromTo but it just whizzes past and everything is performed in 1 go, putting a delay only delayed the start of the animation, not put a pause in the middle. I tried with a timeline, which works, but only for 1 item, when multiple items are used, they stack on top of each other in a mess. Any help appreciated
  7. Tell me about it I've been playing with this for 2 solid weeks, i've barely scratched the surface of what it can do but im making a little progress. A massive thank you as well to the forum answers, quick, accurate and helpful, it's worth the money alone just for that. I'll get sorted now with a license, too good not too. Cheers
  8. Hi All, I'm wanting to use drawSVG and Throwprops plugin on my personal site, there are no chargeable sections, it's just a portfolio site. I want to know what happens after a year, do these plugins disable? I don't mind paying the $99 once, but I can't justify an ongoing cost forever for 2 effects. Can someone please clarify what happens after the year? Cheers
  9. This is the concept idea I came up with a while ago
  10. The idea is that when you press the menu, (hamburger) icon, it will animate the individual items into the circular pattern, which should suggest that it also moves in that direction. The next part is to animate the sub level navs that expand as a layer over the original one
  11. Doh!!!! Easiest fix ever. Cheers for that
  12. Hi all, Trying to make a circular nav with flick, spin and rotating properties. Got it to rotate, but it doesn't seem to flick spin with accelerating and de-accelerating momentum I've added the draggable plugin and set throwProps to true. What am I missing / doing wrong? Any help appreciated.
  13. @OSUblake thank you for that, very interesting way of doing it and actually a lot closer to what I had in mind from a finished visual. The offset is an idea I have been bouncing around to limit the amount of movement and it helps to keep it close to the original shape without it collapsing too heavily onto itself.
  14. @Mikel Cheers for spotting that, sometimes you can spend too long looking at the code
  15. @Carl Cheers for the detailed answer, very useful and helpful. I'll stick with what i've got as this is not going to be a very long list. Thanks
  16. Hi All, I've created a fish eye scaling effect but it uses lots of individual tweens, it seems VERY redundant. I tried creating a timeline but it didn't work at all Would a timeline approach for this work, given I need the instance of the object being hovered?
  17. Now that is very interesting, cheers for that, I think that will solve the problem
  18. Interesting approach and one I'll play with not quite what i'm looking for though as this prevents me from customising the "leave" animation to an easeIn cheers anyway though
  19. Hi All, Im trying to get 2 tweens to animate at the same time when I mouse in over a link, and to reverse the animation when I mouse out. Each tween is working correctly in isolation, they're just not workingvery well together at the same time. The 2nd time you hover, the 2nd tween just jumps between its start and end points, there is no animation at all. I tried adding the position parameter of "0" to the second tweens but it didn't solve the problem Any help appreciated
  20. Thanks for the explanation, works like a charm now
  21. Is there some reason why it won't initialise the callback function when all animations are complete? I've updated my original codepen to reflect this I noticed if I changed it from a TimelineMax back to a TweenMax, the callback function is called
  22. Thank you for the speedy and working demo I'll be honest, I wouldn't have thought of doing the CSS like that and I didn't know you could have staggerTo on a timeline. GSAP is almost too good and too massive
  23. Hi All, I'm looking to stagger the display of a list of items, I only want 1 item to show at once. I have knocked up an example using jQuery but can't figure out how to utilise GSAP for the same action. Ultimately, I want to control the fade and scale of each item as they appear and disappear. Any help appreciated
  24. It is indeed. Thank you very much I can see me having lots of fun with this and an equal amount of frustration as I learn something this massive Cheers
  25. Hi All, I'm trying to create a continuously changing polygon animation that uses randomly generated values for the points. I've got it working for the 1st set of generated numbers, but it doesn't use the subsequent set of values. It keeps repeating between the initial shape points and the 1st set of generated points. Any ideas on how to "refresh" the points so it can constantly change the shape of the polygon Cheers