CSS Tip: What is Scroll Chaining?
I am a software engineer from India- Assam , having a professional experience of 5 yrs building scalable web and mobile apps using technologies like- html, css , javascript, react js , react native etc
Did you ever experienced this behaviour when the parent container starts scrolling once the child scroller reached its full extent .
If you're a victim of this problem anytime than you might have used CSS property overflow-y: hidden on the parent container or might have used position: fixed
You don't need to use such hacks anymore. There is a CSS property to control such overflow effects. Just apply overscroll-behavior on the body to prevent it from happening anywhere.
body {
overscroll-behavior: contain; /* or "none" */
}
Demo- https://codepen.io/jyotishman/pen/yLMKvWX
For more such content, follow me on twitter - https://twitter.com/frontend_jsx
#2Articles1Week #html #css
