Jump to content
Search Community

mikel last won the day on March 14 2022

mikel had the most liked content!

mikel

Moderators

  • Posts

    2,157

  • Joined

  • Last visited

  • Days Won

    71

 Content Type 

Everything posted by mikel

24
25
26
...
82
Page 25 of 82  
  1. mikel
    Hey @niklasinla, Whatever your setup, how about this version? https://codepen.io/mikeK/pen/377761b1a0cbb02f37844ba58386a98a Happy scrolling ... Mikel
  2. mikel
    Hey @Olga__Kondr, Look at this example https://codepen.io/mikeK/pen/36a752bc230ab2a00834148779bce4ec ... or this https://codepen.io/mikeK/pen/cd75b815a0298372fe786f66e6b1e7db?editors=0010 Happy scrolling ... Mikel
  3. mikel
    Hey @ngrmm, That could be the job of the ScrollToPlugin https://codepen.io/mikeK/pen/rNxwpOm?editors=1010 Happy scrolling ... Mikel
  4. mikel
    Hey @Antonio Nardone, I'm still not sure (?), how about this? https://codepen.io/mikeK/pen/OJXZwOw Happy testing ... Mikel
  5. mikel
    Hey @Mike790 Hmmm - I think the code is as DRY as an excellent martini. What do you want to optimize? Happy coding ... Mikel
  6. mikel
    Hey @Antonio Nardone, Welcome to the GreenSock Forum. If I got you right, how about this? https://codepen.io/mikeK/pen/qBNYYxy?editors=1010 Happy stopping ... Mikel
  7. mikel
    Hey @archimedo, Do you expect this to happen? https://codepen.io/mikeK/pen/776c7d4c20cb39e2edcdcb8d0dc6e992 Happy scrolling ... Mikel
  8. mikel
    Hey @Mike790 How would this variant be? https://codepen.io/mikeK/pen/b668c0e114e2421d7fdd5bd16f446955?editors=1010 https://codepen.io/mikeK/pen/66d9622703d9a16b29595d21ae2cb625?editors=0010 Happy clicking or pointing ... Mikel
  9. mikel
    Hey @imChris, How would this variant be? https://codepen.io/mikeK/pen/8c82cde85595852c08943a015e69a4e3?editors=1010 Happy swinging ... Mikel
  10. mikel
    Hey @imChris, It could be a questions of positioning (more here) e.g. try timeline.to(boxInner, { x: sectionMovement.getAttribute('data-x'), ease: animationEase, //overwrite: 'auto' },0) Happy precise timing ... Mikel
  11. mikel
    Hey @phernand42, @ZachSaucier already gave a hint here But you can also just use one scrollTrigger that pin the IMAGE. You can then easily show and hide elements using stagger functions. https://codepen.io/mikeK/pen/wvWjMyM Happy scrolling ... Mikel
  12. mikel

    Svg stagger animation

    mikel replied to Sonix's topic in GSAP

    Hey @Sonix, I would probably stagger https://codepen.io/mikeK/pen/KKMojRK?editors=1010 Happy staggering ... Mikel
  13. mikel
    Hey @theolavaux, Then maybe like this ... https://codepen.io/mikeK/pen/2278160e0d7d0b46162ec02c4a5b7db5?editors=0010
  14. mikel
    Hey @akapowl, I like the concept idea. After a while and trial & error ... https://codepen.io/mikeK/pen/WNxzPBa?editors=1010 Happy weekend ... Mikel
  15. mikel
    Hey @theolavaux, And another concept - SVG prep and coding https://codepen.io/mikeK/pen/942eb37a6652890b60145b61d62e5a9f Happy morphing ... Mikel
  16. mikel
    Hey @theolavaux, For this concept, I have divided only one shape into an TOP and a BOTTOM part (= separate shapes = separate paths) - see the newly named paths. It doesn't work without this preparation. Do you see the difference?
  17. mikel
    Hey @theolavaux, If you want to animate the beginning and the end individually, maybe use separate shapes / parts. Here is an example with a very simple structure: https://codepen.io/mikeK/pen/5cbe8fb4a94c4f2e048c67739f354fe9?editors=1010 Happy morphing ... Mikel
  18. mikel
    Hey @roryh_199, Take a look at splitText and combine it with ... https://codepen.io/mikeK/pen/gOMoJVQ Happy creativity ... Mikel
  19. mikel
    Hey @roryh_199, Welcome to the GreenSock Forum. There are many options. For example using ScrambleText https://codepen.io/mikeK/pen/pobpmGo Happy creativity ... Mikel
  20. mikel
    Hey @Ron Itelman, Do you expect this to happen? https://codepen.io/mikeK/pen/06537b3b69db4021a00e36c6bbd3036a If yoyo:true, every other repeat iteration will run in the opposite direction so that the tween appears to go back and forth. Happy repeating ... Mikel
  21. mikel
    ... or you could use this option https://codepen.io/mikeK/pen/OJXpojK?editors=1010 Happy batching ... Mikel
  22. mikel
    You could use ScrollTrigger.batch() Happy batching ... Mikel
  23. mikel
    Hey Zach, When you get to my age, you'll get one too.
  24. mikel
    Hey @bramroos, Welcome to the GreenSock Forum. You could use repeat-1 and defaults Anything in the defaults object of a timeline gets inherited by its child animations when they get created, so if you find yourself setting the same ease or duration (or any value) over and over again, this can help make your code more concise. https://codepen.io/mikeK/pen/rNLypdY?editors=1010 Happy morphing ... Mikel
  25. mikel
    Hey @adiusz, Both test lines have the same coordinates. You can control starting and ending position like gasp.fromTo ("# test02", {drawSVG: '100%'}, {drawSVG: '0%', duration: 3, ease: 'none'}, 0) https://codepen.io/mikeK/pen/202a4d742f9e635df9057f229e7078e9?editors=1010 Happy drawing ... Mikel
24
25
26
...
82
Page 25 of 82  
×
×
  • Create New...