Jump to content
Search Community

ysk

Members
  • Posts

    7
  • Joined

  • Last visited

About ysk

  • Birthday 05/06/1980

Profile Information

  • Location
    Athens Greece
  1. @Rodrigo thanks for your reply. In no way I'm posting so you can fiddle with my css, I'm only hoping that something might be extremely more obvious to others than me. You' re right about the css, It looks like the height 100% that I used in the absolute positioned pin element caused the extra height. I changed that to bottom: 0 and it worked as expected. https://codepen.io/44db/pen/QWPmLwV Thanks for all your help.
  2. Hello Rodrigo, Thanks for the reply. Setting pinSpacing to false makes no difference. Anymore ideas. If you find the time please have a look on the shared codepen to get an idea of the situation. Thank you so much Yannis
  3. Hello, I have a simple implementation of ScrollTrigger that pins a heading while scrolling until the next one comes in. All nice and good but I'm getting extra space at the bottom. Can someone help me please. Thank you!
  4. Thank you so much @PointC & @GreenSock, Although I consider both replies as the "Marked Solution" I will mark the first one as it solves the issue with the play once. Regarding useGSAP, that is a great helper indeed and the documented examples really help point out the scenarios that it tries to solve. Thanks again for the prompt replies guys. Yannis
  5. Hello I have a list of links and wanted to create a hover effect that animates all elements in some way (ie reduce opacity) but do something different on the hovered element (ie animate a contained span). I have created a pen with a React functional component that uses gsap. In essence I am doing the following: - Create 2 lists of elements (hovered element, non hovered elements) - Create 2 gsap timelines - Trigger those timelines on mouseover and on mouseleave. I have 1 problem and 1 question. Question: am I using best practices? I have wrapped the code inside a gsap context and I'm reverting the context when the component lifecycle ends. However I have 2 eventlisteners that I am not sure if thery are removed when lifecycle of component ends. Problem: animation only happens once for each element. How can i persist the timeline effects? Any help and suggestions would be greatly appreciated. Thank you
  6. ysk

    Pin element to top

    Yes that was it. Thank you so much
  7. ysk

    Pin element to top

    Hello, I'm trying to get my head around on how to pin a div element to top using ScrollTrigger. Pin it when element's top side reaches the top of the browser viewport. Thank you, Yannis
×
×
  • Create New...