mikel last won the day on January 26

mikel had the most liked content!

mikel

Moderators
  • Content Count

    606
  • Joined

  • Last visited

  • Days Won

    23

Everything posted by mikel

  1. mikel

    Center dynamic text around curved path

    Hi @kissu, Welcome to the GreenSock Forum. For me it's easier to build such layouts completely in INKSCAPE. The text is finally converted to paths. Before doing so, make sure you have a copy to make changes to the text later. Happy tweening ... Mikel
  2. mikel

    Randomly moving object

    Hi @Exhumator, Take a look at this example. Maybe it will help you. Happy tweening ... Mikel
  3. mikel

    Timelinemax animation on not specific class

    Hi @bhagyesh229, Welcome to the GreenSock Forum. This is an option: Happy tweening ... Mikel
  4. mikel

    Sites in Showcase.

    Hi, Here are some 'deconstructions': Taotajima.jp WebGL deconstruction Best regards Mikel
  5. mikel

    Follow by mouse

    Hi @Dipscom, That's the next step. As you can see in my first pen, I have already tried ... Kind regards Mikel
  6. mikel

    Follow by mouse

    Hi @OSUblake, You are so right: Stop copying other people's code you don't understand! I still have this stupid habit. Thanks Mikel
  7. mikel

    tween without taking up 'space' in timeline

    Hi @stupidsimple, Take a look at this: position-parameter And try var tl = new TimelineMax({}); tl.to(".orange", 1.0, {y:200}) .to(".photo", 12.0, {scale:1.2}) .to(".button", 1.0, {opacity:1.0},0) //insert tween at second 0 into timeline Happy tweening ... Mikel
  8. mikel

    keydown and carousel

    Hi @benoit, or ...
  9. mikel

    keydown and carousel

    Hi @benoit, Here just a test ... Happy tweening ... Mikel
  10. mikel

    Follow by mouse

    Hi @wneet, Even during and after a scrolling phase, 'Oscar' follows the mouse - a small movement of the mouse is enough. Happy tweening ... Mikel
  11. Hi @omarel, sure, here one example of @PointC - he has a lot of svg stuff! Best regards Mikel
  12. Hi @omarel, As Jack explains: morph only means morph from one to another shape. But you can build, vary, control all the other steps (position, rotation, size, timing ...) very easily. Yes, if you like, gradually morph into multiple levels (different shapes). It depends on how it should look like. Here is a little suggestion ... Happy tweening ... Mikel
  13. mikel

    Hover and out on elements to animate another

    Hi, Here's a suggestion for an alternative concept ... With a quick mouse movement it feels more comfortable - so my feeling, when the 'last / previous' motif runs out of the window upwards. This example with 'mouseenter' and the 'last' motif remains in its position. Happy tweening ... Mikel
  14. mikel

    Random Repeat Delay Issue

    Hi @padders, How about this version ... Happy tweening ... Mikel
  15. mikel

    staggering data from multiple arrays?

    Hi @UnioninDesign, I'm not sure if I understand your concerns correctly. Here is my interpretation ... Kind regards Mikel
  16. mikel

    how to move svg circle

    Hi @Lacika1981, There are many parentheses to consider ... // a standard example TweenMax.fromTo(element, 1, {x:0}, {x:100}); In your case Happy tweening ... Mikel
  17. mikel

    Draggable breaks SVG

    Hi @Magnu5, Hi @Rodrigo, The original CodePen case was changed (?).
  18. Hi @dadamssg, "With transformOrigin for the rays, then the entire svg must be rotated. Otherwise there is chaos ..." But if you set transformOrigin:"center" for the grouped rays also, the rotation of all rays is perfect. Here's an article @GreenSock wrote about transform origin in SVG: https://css-tricks.com/svg-animation-on-css-transforms/ Use GASP and have the chaos under control ... Mikel
  19. Hi, As I said, you can also calculate it for each ray. And then staggerTo plus cycle does a great job ... Nice Weekend ... Mikel
  20. Hi @dadamssg, Welcome to the GreenSock Forum. To achieve this, transformOrigin offers a solution. You can specify an individual value for each ray to make the rays smaller towards the middle. If you can calculate this values. I chose "center" - the easy way, it's the same for everyone. With transformOrigin for the rays, then the entire svg must be rotated. Otherwise there is chaos ... Happy sunshine ... Mikel
  21. mikel

    Thanks Greensock | SOTD & DEVELOPER on Awwwards. 🏆🏆

    Hi Victor, Congrats. I wish you a lot of success with your performance. You and your work deserve it. Kind regards Mikel
  22. mikel

    StaggerTo from a single origin

    Hi @OODNX, "to animate from a single point of origin": using staggerTo you can define an array of values to cycle through (like cycle:{x:[100,-100], rotation:[30,60,90]}). Here used to set the persons (row 01) to an common point: The SVG spec does not support 3D transforms. You can try wrapping your SVG in a containing div and rotating that. Happy tweening ... Mikel
  23. mikel

    ScrollToPlugin won't scroll divs or body etc.

    Hi @Tazintosh, sorry, I was too fast ... That´s a point for the experts. Kind regards Mikel
  24. mikel

    ScrollToPlugin won't scroll divs or body etc.

    Hi @Tazintosh, Unfortunately, I do not have the time to analyze your code. Try it with this pen: Happy scrolling ... Mikel
  25. mikel

    Repositioning Flex or Inline elements not working

    Hi @infiniteS3t, Welcome to the GreenSock Forum. Take a look at this example of our expert @OSUblake. He calls it simple, but some calculations are needed. He also has a playground regarding flex: Best regards Mikel