Jump to content


  • Posts

  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

Laurie's Achievements

  1. THANK YOU Jack! I didn't know the Most common GSAP mistakes! I'm gonna read it immediately!
  2. Hello Jack, Thank you for the answer and the demo ! 😃 However, I'm still wondering how to achieve this kind of animation : I try to add a clearProps: 'scale' to my animation, because it seems the Flip does not working with the transform. I just want to animate 2 steps : - 1st step : change the background color and the scale of the square - 2nd step : Center the square in the body (as a fixed element) - and I think the Flip plugin is perfect to do that, right ? Here's the new CodePen I did, with clearProps (but we can still see the square is not centered because of the transform properties) https://codepen.io/LaurieVince/pen/wvPWKym Thank you again, Laurie
  3. Hello everyone, I am testing the new Flip plugin and I'm wondering how to use it with Timelines. Here's an example of my curiosity : I'd like to animate an element with a timeline, then use the Flip method pour add a class name to the body for a fixed position. Am I right with it ? It seems the position is not working as I exepected... I attached my CodePen to my post to illustrate it. Thank you, Laurie
  4. Thank you PointC ! I didn't notice I had to hide the second path in my SVG. Here's a new test : https://codepen.io/LaurieVince/pen/dyvMZrm I'm wondering how to create with SVG Morph the same effect linked my previous post. I tried to use transformOrigin but I failed. Thanks again, Laurie
  5. Good morning, I've been trying to create an effect for a long time, but I can't quite figure it out. I found so many topics here, and I'm so grateful for all the community. I saw this topic and this is actually what I'm trying to create with some waves shapes - made with the SVG Morph plugin ! It looks close to the effects I saw on CoDrops here, and I tried to do this with the plugin (but I failed, in my Codepen that I linked) Other inspiration for that kind of effect is : this one I'm not an export in SVG and have some limited knowledge about animations, but I really would like to know how to achieve this kind of effect to include this in my portfolio (to find a great job in front-end development!). Could someone help me on this topic? Thanks in advance, Laurie https://codepen.io/LaurieVince/pen/BaWKoqE
  6. Hey, I saw this post about the conception draggable slider using GSAP. I search for a tutorial to make this type of slider for hours, but I don't find it. So, I'm wondering if someone knows a good tutorial to create this. Thanks a lot, Laurie
  7. Laurie

    Text mask animation

    Thanks a lot Zach! 😃
  8. Laurie

    Text mask animation

    Hi Zach, Thanks for the answer! Yes, SVG is probably the best way to create what I want. I saw the thread, and found this CodePen : this is almost what I try to create. But is this possible to insert the background directly in the text area to reproduce the image I linked in my first post ? I never used SVG before. Thanks again, Laurie
  9. Hi, I'm wondering how I can create a text mask animation. Actually, I don't know if it's possible to create something like this without SVG. Here's a preview of what I'd like to make : https://ibb.co/C50cJ4b I would like to animate the mask (that is black in the picture). I saw this post in the forum, but actually I'm a beginner and I don't know how to create what I want. Thanks a lot ! Laurie
  10. Sorry for the delay. Thanks a lot for the answer. One last thing : I'm wondering if I'm right if I write simply the simply syntax for gsap : gsap.to(".myContainer", { color: "red", scale: 1.2, delay: 1 }); Do you know if it's a good method to write the class name with React, or should I use only Refs ? Thanks again, Laurie
  11. Thanks OSUblake ! Actually, I didn't know for the easings. Great news ! I'm trying to only use hooks, with GSAP. But I don't know how to correctly target elements. I read that we have to use refs but I don't know if this is a correct method for GSAP. What do you think about that ? Thanks again! Laurie
  12. Hey ! I'm experimenting GSAP3 with React Hooks - that I learn everyday. And as a beginner, I just want to know if my code is ok or not. The animation is very easy, but I'm worried about the useEffect and useRef utilisation with GSAP and even if the animation's working, I'm interested to write the best code I could. Here's the example I made. If someone had a few minutes to take a look, it would be very kind! Thanks a lot, and have a great day! Laurie
  13. Hey Zach, thanks for the answer! I just wanted to animate the mix-blend-mode on an image, like this : https://codepen.io/LaurieVince/full/BaNjGdb Any recommandation ? Thanks again, Laurie
  14. Hey ! I'm trying to use mixBlendMode in the new GSAP, but the duration is not respected. The effect works, but immediately, even if I write a duration of 4 seconds. Is everyone can help me with this issue ? Thanks a lot, Laurie