Search the Community
Showing results for tags 'rubber-band'.
Found 3 results
-
Animation switching to rubber band scrolling after navigated with a tag
pascalgehring posted a topic in GSAP
I have a scrub animation, navigated by a Tags (scroll down arrow). When I navigate with the scroll down arrow, the scrolling switches to the rubber band scrolling. This weirdly only happens on mobile safari and isn’t reproducible on codepen… Here’s a link to the page: Sample Page Thank you for any hints or comments! IMG_1229.MOV -
Hi, Does anybody know how to disable rubber-band effect in macOS with using tweenmax smooth scrolling? I know how to disable rubber-band using a simple code, but it doesn't work with smooth scrolling. I think it happens because smooth scrolling using body/html scroll indication. Is it possible to change scroll indication from body/html to any div element or is there any way to disable rubber-band effect? The simple custom code for disable rubber-band effect: html { height: 100%; width: 100%; overflow: hidden; } body { height: 100%; padding: 0; overflow: auto; margin: 0; -webkit-overflow-scrolling: touch; } Rubber-band in macOS Chrome browser: <iframe src="https://giphy.com/embed/S6kGqZiGacx6FyJmLC" width="480" height="300" frameBorder="0" class="giphy-embed" allowFullScreen></iframe><p><a href="https://giphy.com/gifs/S6kGqZiGacx6FyJmLC">via GIPHY</a></p>
-
Hello ? First time poster here. I'm trying to mimic the scrolling behavior of this site, where the text's vertical position lags behind the scroll position. The effect is most obvious in the navigation menu (click the hamburger icon in the top left). You'll notice that if you scroll down quickly to the bottom of the page, it takes about two seconds for the text to catch up to the scroll position. This looks like something I could use ScrollTrigger for. In the the docs page video at about 9:50, you can see that the orange box lags the .ghost box by one second when it has the setting scrub: 1. This is the behavior I want, except it should animate the text's vertical position on the screen. The problem is that, unlike with the horizontal position, the vertical position of the element in the DOM doesn't change -- only the scroll position changes. Any ideas how I can achieve this effect?
