Jump to content
Search Community

12345

Premium
  • Posts

    3
  • Joined

  • Last visited

About 12345

12345's Achievements

  1. @mvaneijgen Thanks for the update! The problem with using fontSize (and why I think @Rodrigo switched to using CSS vars) is, that when resizing the browser window, it does not update the font size responsively anymore. EDIT: Just realized that I scope the CSS variable in the live code anyway, so it’s working without problem now. The issue really was the easing using a default value. Thanks a lot! Great support here.
  2. Hi @Rodrigo Thanks for the super quick response and your help! I could update my live code so that it is responsive now. However, I might have made my codepen a bit too simple or too far away from the actual live code, that’s why I updated it here: https://codepen.io/dsdsdsdsdsds/pen/LYXjMMV The issues I have now: The content in the red box almost stops when it’s close to the top of the viewport, like it gets pinned there. I’m not sure what causes this, as it is less visible in your example (without any text content inside the red box) I actually have two of the same animations below each other. When I do that, the second title is hidden behind the blue spacer. Sometimes, it pops up after I scroll past the title and back up, but it is hard to reproduce constantly. Any idea what causes these issues?
  3. Hi there, I’m trying to achieve the following: A title should be scaled down gradually to a font-size of 0 based on scroll interaction. The attached demo is already doing that quite well, but there are two issues: When resizing the window, the initial font size, which is set with the VW unit directly in CSS, does not scale anymore. I’m aware that GSAP is converting the VW to PX internally. Is there a way to work around that? Currently, the scaling of the font size happens "too quickly". In the demo, one can see that the distance between the scaling text and the red box below it increases, the smaller the text gets. This is not how it supposed to be. The gap between them should stay constant. Requirements: The titles cannot be images/SVGs, they need to stay pure text The initial font size has to be set with the VW unit (or at least needs to be responsive) Very thankful for hints and tips on how to solve this!
×
×
  • Create New...