Jump to content
Search Community

Trabajador

Members

  • Posts

    33

  • Joined

  • Last visited

 Content Type 

Posts posted by Trabajador

    Footer animation

    in GSAP

    Posted

    4 hours ago, Trabajador said:

    In your last example, the main site overlaps the top of the footer if the footer is taller than the screen height.

    Here's my answer, I also showed how it looks visually in screenshots

    39 minutes ago, Trabajador said:

    Your demo - My demo


    I have pages without an upper footer, what should I do in this case?

    11 minutes ago, GreenSock said:

    So you just want the overlap to be defined by that child element height (the text)? Simple! Just change the selector in my demo to point at that instead of the whole footer: 

    Footer animation

    in GSAP

    Posted

    29 minutes ago, GreenSock said:

    This is also one of the reasons I suggested my original approach that uses position: fixed because that won't be dependent on moving the element on every scroll event to fake the pinning - it persists the whole time the ScrollTrigger is active and doesn't need any JS to run to keep it pinned. You never answered me about why you took a totally different approach than the one I suggested. 

    I gave you the answer

     

    29 minutes ago, GreenSock said:

    It seems like we're somehow missing each other here. I'm very confused about what you're saying - does my solution work or not? From what I understand, it's doing exactly what you requested, but you keep bringing up your old (incorrect) demo that layers things wrong, as if you're still not using the solution(?) 

    Just compare

    See the Pen jOdMRBR?editors=0010 by trabajador-the-flexboxer (@trabajador-the-flexboxer) on CodePen

    with

    See the Pen YzBpWRW?editors=0010 by GreenSock (@GreenSock) on CodePen

    , why is my incorrect implementation working the way I need it, but in your demo the main site overlaps part of the footer with part of the text in which it is hard to read

    Your demo - My demo

     

    Visually, my solution is more suitable for me, how can I achieve this result with the right approach.
    Thank you very much for your help, I really appreciate your attention!

    Footer animation

    in GSAP

    Posted

    I'm using lambdatest, but it seems it will work the same on a physical device. I think this is due to different scrolling mechanics. Yes, I tried to add ScrollTrigger.normalizeScroll(true), then on Windows the scrolling becomes the same as on Mac OS. In your last example, the main site overlaps the top of the footer if the footer is taller than the screen height. In my example, the upper footer is shown first, and then the rest of the footer.

    https://prnt.sc/ak00tYcoRnVb

    Footer animation

    in GSAP

    Posted

    See the Pen RwvowBo by mvaneijgen (@mvaneijgen) on CodePen

     

    in this example there is something similar, but I need the main site to be on top of the footer, how can I swap them, that is z-index of the main site should be larger and it should overlap the footer, when start: "bottom bottom", the main site should continue to scroll up and the footer should appear from underneath it

    Footer animation

    in GSAP

    Posted

    @mvaneijgen Thanks for your help!
    I'll try to describe it in more detail
    I need the main site to be on top of the footer, and when the scroll reaches the footer, the footer is shown from under the main site and we can scroll to the end. Plus I need to take into account that the main footer can be without upper footer

    Two columns animation

    in GSAP

    Posted

    32 minutes ago, Carl said:

    I'm sorry, what does "something goes wrong" mean?

    Sometimes we aren't seeing the same thing as you or know the expected results. 

    please try to be more descriptive. thanks

    I solved all the problems, thanks :)

    • Like 2

    Two columns animation

    in GSAP

    Posted

    4 hours ago, Trabajador said:

    One more question, how i can animate second and third text blocks from bottom? Now this blocks animated from top.
    And how can this block be made universal, for an indefinite number of elements?

    I have resolved these issues. Now the question is how do I get rid of such a space that is reserved by the pin spacer? There is no spacer in my reference ?

    Two columns animation

    in GSAP

    Posted

    One more question, how i can animate second and third text blocks from bottom? Now this blocks animated from top.
    And how can this block be made universal, for an indefinite number of elements?

1
2
Page 1 of 2  
×
×
  • Create New...