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

Everything posted by mikel

  1. Hey @bootstrap007, A simple solution: add a few boxes (duplicates). Or use a mediaquery: bigger box, bigger typo. Or use an alternative marquee concept. Happy coding ... Mikel
  2. Hey @bootstrap007, Here are two suggestions for your questions. Try to adapt the logic to your needs. https://codepen.io/mikeK/pen/9ce005bdad509ae1fed02cc107ad4421?editors=0010 https://codepen.io/mikeK/pen/VwjLVqW Happy tweening ... Mikel
  3. Hey, An attempt to achieve a dynamic per ease: "slow (0.2, 0.6)". https://codepen.io/mikeK/pen/qBmpbPw Happy easing ... Mikel
  4. ... another option if you want to scrub the rotation too. https://codepen.io/mikeK/pen/WNjEBpq?editors=0010 Happy tweening ... Mikel
  5. Hey @limitcracker, Welcome to the GreenSock Forum. SVGs are a great playing field and offer plenty of inspiration for animation. https://codepen.io/mikeK/pen/RwKamBO?editors=0010 https://codepen.io/mikeK/pen/930ba6044f3421ce11fe085a2ec57009 Happy tweening ... Mikel
  6. ... another, better option https://codepen.io/mikeK/pen/mdmwoqV?editors=0010 Happy scrolling ... Mikel
  7. ... another option https://codepen.io/GreenSock/pen/vYmZepb?editors=1010 Happy scrolling ... Mikel
  8. mikel

    Svg animation

    Hey @Fay Kay, You need a shape (SVG) adapted to your needs (?). https://codepen.io/mikeK/pen/RwVgBEG Happy scrolling ... Mikel
  9. Hey @GreenSock, Thank you very much. I did not realize this constellation. Happy tweening ... Mikel
  10. mikel

    Svg animation

    Hey @Fay Kay, Let GSAP do the job: rotation and shape. Is that what you expect? https://codepen.io/mikeK/pen/dyWRooK?editors=1100 Happy scrolling ... Mikel
  11. Unfortunately I have no idea what is going wrong. Let's wait for the experts.
  12. Hey, One should determine the relevant distance for the 'containerRight'. There is a catch though: After window resize, the scroll trigger for the words does not work correctly. Unfortunately I can't find the bug, don't understand the logic. In addition, here in the iframe and in debug mode 'y: -515' leads to a different result. https://codepen.io/mikeK/pen/poPwzae May the experts have an answer. Mikel
  13. Hey @Xurshed, If you mean the typo animation this is an option. https://codepen.io/mikeK/pen/mdmmGOX Happy tweening ... Mikel
  14. Hey @Carl, And I'm a fan of your slider trick const slider = gsap.fromTo(action, {time:dur}, {time:action.duration()-dur, paused:true}) https://codepen.io/mikeK/pen/JjNNZRv Thanks and happy tweening ... Mikel
  15. Hey, A tricky, definitely not the best solution. https://codepen.io/mikeK/pen/XWRRWNQ Happy tweening ... Mikel
  16. ... just a little joke. https://codepen.io/mikeK/pen/GRmWYMg Happy tweening ... Mikel
  17. Because it is fun ... https://codepen.io/mikeK/pen/PomGKON Happy tweening ... Mikel
  18. ... another option: hand-coded path. Easy to customize when there are just a few buttons. https://codepen.io/mikeK/pen/jOmVyqR Happy tweening ... Mikel
  19. Hey @Milan_K, ... with a little help of @GreenSock. To be pinned or not to be pinned! or The Taming of the Shrew. https://codepen.io/mikeK/pen/jOmVWGB Happy pinning ... Mikel
  20. Hey @BhanuSingh, You can morph a single shape (path) to another shape (path). Not a complete group of paths! MorphSVGPlugin.convertToPath: Technically it’s only feasible to morph <path> elements or <polyline>/<polygon> elements, but what if you want to morph a <circle>, <rect>, <ellipse>, or <line>? MorphSVGPlugin.convertToPath("circle, rect, ellipse, line, polygon, polyline"); You don't need a conversion for a path. Does that help you further? In the DOCS are a lot of examples. Happy morphing ... Mikel
  21. Hey @Milan_K, Welcome to the GreenSock Forum. It is better this way? https://codepen.io/mikeK/pen/oNWzawx What do you mean by 'this animation smooth'? Happy tweening ... Mikel
  22. Hey @lucasleibs, There are a few options for accomplishing this. Here are two examples that can provide suggestions. https://codepen.io/mikeK/pen/qBqEeMj?editors=1010 https://codepen.io/mikeK/pen/xxgJqpp?editors=0010 Happy tweening ... Mikel
  23. Hey @deniscapece, Does that look like fluid for you? https://codepen.io/mikeK/pen/Vwbjvdg Happy tweening ... Mikel
  24. Hey @purple-lightsaber, You could use GSAP DrawSVG. https://codepen.io/mikeK/pen/XWjaBgm Happy tweening ... Mikel
  25. Hey @BhanuSingh Have you tried inline Scalable Vector Graphics? https://codepen.io/mikeK/pen/8ca55a8da56dc3f6e6cae793864b2eb2 Happy scaling ... Mikel
×
×
  • Create New...