mikel

Hey @midnightgamer, This could be an option https://codepen.io/mikeK/pen/JjXqBNw Hey ZACH: Why does the width jump to 100% (flex ?)? Better .. https://codepen.io/mikeK/pen/JjXqBeq If any questions ... you are welcome Happy tweening ... Mikel

Hey @Bram Huisman, Here are a few ideas https://codepen.io/mikeK/pen/YzyVpwg?editors=1010 Happy tweening ... Mikel

Hey @Varunbht, To compensate for the 'faster' vertical movement, a logic could be defined that counteracts the position of the SVG. Here is a simple experiment adapted to certain sectors (a fixed width of the SVG!). See better with a larger window height. https://codepen.io/mikeK/pen/XWdwdeR Happy tweening ... Mikel

Hey @3rst, Welcome to the GreenSock Forum. Does this example help you? https://codepen.io/mikeK/pen/VwaRJYZ Happy tweening ... Mikel

Hey @Narendra Verma, It could be better to pin the relevant section https://codepen.io/mikeK/pen/WNwmdEB?editors=1010 Happy sliding ... Mikel

Hey @Narendra Verma, Is this an option for your for your intention? https://codepen.io/mikeK/pen/dyMrZzG?editors=0110 Happy tweening ... Mikel

Hey @pw_ws, Welcome to the GreenSock Forum. Look at this example in the SrcollTrigger docs https://codepen.io/GreenSock/pen/rNOBLBV?editors=1000 Happy scrolling ... Mikel

Hey @Narendra Verma You could pin the 2. section and run a tween/timeline: https://codepen.io/mikeK/pen/NWNJWrX Happy tweening ... Mikel

Hey @kylerumble, Here is an example with simple circles recommended by @Richard1604 https://codepen.io/mikeK/pen/XWdOvmd?editors=1010 Happy tweening ... Mikel

Hey @Rushmore, I am not sure what exactly you want to achieve. Please have a look at the docs for .addPause() . Here's an example https://codepen.io/mikeK/pen/15780caeb430acab3fff5eeb261c203a Happy pausing ... Mikel

Hey @Satheesh, Welcome to the GreenSock Forum. Take a look at the MorphSVGPlugin in the docs. Here is an example https://codepen.io/mikeK/pen/KORMKE Happy morphing ... Mikel

Hey @Joshua6, Welcome to the GreenSock Forum. Take a look at the plugin ScrollTrigger in the docs. Here is a similar example https://codepen.io/mikeK/pen/ZEbWoem?editors=0010 Happy tweening and scrolling ... Mikel

Hey @phernand42, You can use autoAlpha. You have set both elements in the CSS visibility: hidden. So you can show them with autoAlpha: 1. autoAlpha Identical to opacity except that when the value hits 0 the visibility property will be set to hidden in order to improve browser rendering performance and prevent clicks/interactivity on the target. When the value is anything other than 0, visibility will be set to inherit. It is not set to visible in order to honor inheritance (imagine the parent element is hidden - setting the child to visible explicitly would cause it to appear when that’s probably not what was intended). And for convenience, if the element’s visibility is initially set to hidden and opacity is 1, it will assume opacity should also start at 0. This makes it simple to start things out on your page as invisible (set your CSS visibility: hidden) and then fade them in whenever you want. https://codepen.io/mikeK/pen/poyQZqj Happy scrolling ... Mikel

Hey @CommonUser, If you need some help, please provide a minimal demo in CodePen so that we can see things in context. We'd be happy to help, but it's tough without any demo. Thanks ... Mikel

Hey @jayakannan, Please provide a minimal demo in CodePen or JSFiddle or something so that we can see things in context. We'd be happy to help, but it's tough without any demo.

Hey @jayakannan, Welcome to the GreenSock Forum. I am not sure what exactly you want to achieve. You could use timeScale to control the timing. Please note ease: 'none' (default is 'power1.out') to ensure a steady speed. https://codepen.io/mikeK/pen/MWyVELQ Happy speeding ... Mikel

Hey @ozcancelik, Welcome to the GreenSock Forum. Define a certain starting position of the ScrollTrigger. The default for type: "toggle" ScrollTriggers: "top bottom"; for type: "progress": "top center". https://codepen.io/mikeK/pen/abNGeKZ?editors=1010 Does it help? Happy twening ... Mikel

Hey @Lars Ejaas, I suspect you are not yet satisfied with the board animation. Here is a suggestion https://codepen.io/mikeK/pen/wvGjbLM Happy tweening ... Mikel

Hey @Richard1604 You could try the SVG filter feGaussianBlur. And then there are several posts about 'follow mouse' here in the forum. https://codepen.io/mikeK/pen/xxVjGaa happy tweening ... Mikel

Hey @pixelpillow, Welcome to the GreenSock Forum. You could use timeScale to scale the time of an animation. https://codepen.io/mikeK/pen/MWyVELQ Happy tweening ... Mikel

Hey @jnhltmn, Is this an option for you? https://codepen.io/mikeK/pen/MWyVELQ Happy driving ... Mikel

A little researched out of interest and fun: here is a spider web https://codepen.io/danzen/pen/WaPYeV?editors=0010

Hey @friendlygiraffe, Could this be an option for you? Regardless of whether path or polygon points ... https://codepen.io/mikeK/pen/qBZXJYR Happy tweening ... Mikel

Hey @Zeyi, More suggestions: you could use linear or rotational morphs or custom origins and findMorphOrigin () - more here in the docs. Or you can partially open up the area so that the individual areas can be animated better. https://codepen.io/mikeK/pen/jOqYXrE https://codepen.io/mikeK/pen/bGpaOYG Happy morphing ... Mikel

Hey Christopher, here an example https://codepen.io/mikeK/pen/RwNKBrB?editors=0010 Happy drawing ... Mikel