Jump to content
Search Community

JoPed

Members
  • Posts

    5
  • Joined

  • Last visited

JoPed's Achievements

  1. JoPed

    Zoom in effect

    Thank you for the response. Ah of course, that makes sense with the scrub. And I never knew about the CSS part. Thank you so much! And to answer your question, I was trying to make the out animation not seem so jumpy (hope that makes sense?). EDIT: After testing the edited codesandbox it looks much better. Again, thank you for your time!
  2. JoPed

    Zoom in effect

    Hi, I'm trying to make a zoom-in effect using the ScrollTrigger. I feel like I'm almost there, but I don't like way it kinda snaps back to the default state. This happens when you scroll back down and the image is on the way out of the viewport. How can I make that transition more smooth? Minimal demo: https://codesandbox.io/s/zoom-in-effect-epv9s8
  3. Thank you both for your help. Much appreciated!
  4. @Rodrigo thank you for the quick response, but it does not work. I want to be able to use the navbar to scroll to the section, corresponding to the li from the header. And this only works, if the section you are going to are below the section you are currently at, for example it works when pressing "Item 1" and then "Item 2", and "Item 3" and "Item 4", but it does not work when pressing "Item 2" and then "Item 1". I think that is because of the pinned scrolling, but i don't know for sure, and I don't know how to count the effect.
  5. Hi, I'm very new to GSAP, so I this might be fairly simple or not possible to accomplish. My problem: I'm using the ScrollToPlugin for scrolling to a given section, when clicking on the menu item corresponding to that section. I also use pinned scrolling - I have pinned scrolling between container 1/container 2, and between container 2/container 3. What happens, is that when going to an section above where you are (in the document flow), either no scrolling appears to happen or it scrolls to the wrong section. An example: Press "Item 2", and then when the scroll finishes press "Item 1". This results is no visual change, and the second section is still the one inside the viewport. However if you press "Item 3" and then "Item 1" you go to item 2. Here is the jsfiddle, https://jsfiddle.net/r7Lotu5w/ EDIT: I found a solution, where I disable scrolltrigger when using scrollto and the enable the scrolltrigger again once the scrolling is done. But I would still like to know if there is another way to achieve what is want.
×
×
  • Create New...