Jump to content


  • Posts

  • Joined

  • Last visited

Everything posted by Romanus

  1. Hello! I'm trying to pin section 1 so that section 2 moves up while the first one doesn't move. I tried Pin, but I ended up making the scrollbar bigger. While the first section does not move, the second does the same. How to achieve the desired result?
  2. Hello!) I have a ScrollTrigger animation. I'd like to change the color of the cube halfway through. How can i do this?
  3. Hello! I am using gsap in react. I would like to put all the animation logic in the component that is being animated. In order for the MenuPage animation to be found in MenuPage. But I put this animation in the parent component, because it contains the state responsible for the variable rendering. I start the closing animation, and then I remove the element. When I want to make changes, I have to remember exactly where the animation is. This started to bother me when I made a lot of modal windows and started to fine-tune the structure of the application. I want everything to be in place Maybe somehow you can register the animation in one place, and call it in another. Or maybe you have ideas how to make it more convenient. If you need I can make an example to illustrate the question
  4. Hello! I am using Smooth Scrolling. And I want to be able to completely stop scrolling and resume. What function should be written for this?
  5. Thank you!) Good advice. But I got a strange problem when I tried to replicate this code in my application. I get an error - Uncaught TypeError: gsap__WEBPACK_IMPORTED_MODULE_14__.default.context is not a function I do everything exactly the same as in your example. I will try to fix it or repeat it on codepen. But for several hours I can not understand what's wrong. Can you guess why this is?)
  6. Hello! I'm trying to get a React component to fade in and out smoothly. I don't understand what to do next. Help me please
  7. Hello! In my example, on mouse click, two svg dots are raised. I would like to animate each of them individually so that each one has a random duration. Is it possible?
  8. Romanus

    smooth scrolling

    Hello! I found a smooth scrolling site. All elements move very smoothly. I googled for a long time, but did not even find a similar example. Any ideas how this can be repeated? https://www.sweetpunk.com/en/
  9. Romanus

    variable target

    I redid my example. It works perfect. But I feel like I've chosen the wrong path. It turns out that I create a new timeline for each page. What if there are 10 or 50? It seemed to me that choosing a variable as a target and changing it depending on the page would be the right solution, but I did not succeed. I am new to GSAP and would like to understand how to make the animation code as short and scalable as possible. Please look at my code and tell me how to fix it.
  10. Romanus

    variable target

    Please show with an example how to update the timeline correctly. I would like to be able to play it in reverse when pressed again.
  11. Romanus

    variable target

    Hello! Please help me understand how it works. My goal: I click on the Page1 button - Page1 opens, I click again - it closes. And so with any Page. I specified a variable as target. When I click on the button, I change its value and play the animation. But GSAP doesn't see the new value. How to do it right?
  12. In your example, pause after each play. I would like to make a smooth animation, like in the example that demonstrated
  13. https://codepen.io/anthonysimone/pen/JmRKzz
  14. Hello! I am trying to make an animation of the stars. I don't know how to make them rotate out of sync. Below is the example I am trying to reproduce
  15. Romanus


    Hello! I found a very good example and want to use it in my project. It uses TweenMax and staggerFromTo. It seems these functions are already deprecated. Please help to adapt this example to the modern syntax. I can't solve this problem for a long time
  16. Romanus

    Animation break

    Hello! I am writing through google translator. Sorry if I'm not making my point clear. I made a menu animation on the timeline. She works well. But if you close the menu immediately after opening, and immediately open it again (press 3 times quickly on the menu button), the animation is displayed very poorly. Please tell me what am I doing wrong
  17. https://codepen.io/romanusss/pen/wvPYpyw I made an example. All markers move and never collide. If you remove the 2 lines in the Parallax block that I wrote about above, everything works, except for the Parallax effect.
  18. Hello! I write through GOOGLE translator. I'm sorry for the mistakes The animation worked perfectly until I added: overflow-x:hidden; overflow-y: auto; to any block. When I add this, a strange problem appears. ALL markers start to move up and down after the scroll. Also the animation doesn't work until I manually resize the screen. First, I scroll until the animation fires, it does not work, I stretch or shrink the screen, and it works. This problem appears on ALL animations after adding these two lines to ANY block. If I remove overflow the problem completely disappears. help me please